:root {
    --admin-bg: #07090a;
    --admin-bg-soft: #0c1012;
    --admin-panel: #111517;
    --admin-panel-2: #151a1d;
    --admin-line: rgba(218, 166, 63, .2);
    --admin-line-strong: rgba(218, 166, 63, .55);
    --admin-gold: #d9a541;
    --admin-gold-light: #f1cd78;
    --admin-gold-dark: #8e5c18;
    --admin-red: #9e1619;
    --admin-red-light: #e24d4f;
    --admin-green: #43bd81;
    --admin-blue: #4d9de0;
    --admin-text: #f5f2e9;
    --admin-muted: #9ba3a5;
    --admin-shadow: 0 24px 70px rgba(0, 0, 0, .34);
    --sidebar-width: 280px;
    --sidebar-collapsed-width: 88px;
}

[data-theme="light"] {
    --admin-bg: #f3f0e9;
    --admin-bg-soft: #ebe6dc;
    --admin-panel: #fffdf8;
    --admin-panel-2: #f7f2e8;
    --admin-line: rgba(139, 94, 24, .18);
    --admin-line-strong: rgba(166, 108, 22, .48);
    --admin-gold: #a86a13;
    --admin-gold-light: #86520c;
    --admin-gold-dark: #6f430a;
    --admin-text: #25282a;
    --admin-muted: #6f7779;
    --admin-shadow: 0 18px 50px rgba(76, 54, 22, .09);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: "Leelawadee UI", Tahoma, Arial, sans-serif; color: var(--admin-text); background: var(--admin-bg); }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
img { max-width: 100%; }

.admin-body {
    min-height: 100vh;
    background:
        radial-gradient(circle at 80% 0%, rgba(173, 111, 19, .1), transparent 30rem),
        linear-gradient(135deg, #090b0c 0%, #07090a 55%, #0b0c0c 100%);
}

.admin-shell { min-height: 100vh; }
.admin-sidebar {
    position: fixed;
    z-index: 40;
    inset: 0 auto 0 0;
    width: var(--sidebar-width);
    display: flex;
    flex-direction: column;
    padding: 22px 18px 18px;
    overflow-y: auto;
    border-right: 1px solid var(--admin-line);
    background:
        linear-gradient(180deg, rgba(255,255,255,.025), transparent 25%),
        #0c1012;
    box-shadow: 18px 0 50px rgba(0, 0, 0, .2);
    transition: width .24s ease, padding .24s ease, transform .25s ease, background .2s ease;
}

.sidebar-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 84px;
    padding: 12px 13px;
    margin-bottom: 14px;
    border: 1px solid rgba(218, 166, 63, .14);
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(218, 166, 63, .08), rgba(255,255,255,.02));
}
.sidebar-brand img { width: 55px; height: 60px; object-fit: contain; filter: drop-shadow(0 8px 10px rgba(0,0,0,.45)); }
.farm-logo-image {
    padding: 4px;
    object-fit: contain !important;
    object-position: center;
    background: #020202;
    border: 1px solid rgba(218, 166, 63, .52);
    border-radius: 16px;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .38), inset 0 0 0 1px rgba(255, 223, 151, .08);
}
.sidebar-brand img.farm-logo-image { width: 64px; height: 64px; filter: none; }
.sidebar-brand strong, .sidebar-brand span { display: block; }
.sidebar-brand strong { color: var(--admin-gold-light); font-size: 15px; line-height: 1.35; }
.sidebar-brand span { color: #d8d1c3; font-size: 13px; margin-top: 2px; }

.sidebar-nav { display: grid; gap: 5px; }
.sidebar-nav a {
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 46px;
    padding: 10px 13px;
    border: 1px solid transparent;
    border-radius: 10px;
    color: #c8cccc;
    font-size: 14px;
    font-weight: 600;
    transition: .2s ease;
}
.sidebar-nav a span { width: 24px; color: #cfbd96; font-size: 19px; text-align: center; }
.sidebar-nav a:hover { color: #fff; border-color: rgba(218, 166, 63, .18); background: rgba(218, 166, 63, .06); transform: translateX(2px); }
.sidebar-nav a.active {
    color: #18120a;
    border-color: #edc26c;
    background: linear-gradient(135deg, #f0ca74, #bc7a20);
    box-shadow: 0 9px 24px rgba(183, 115, 24, .24), inset 0 1px rgba(255,255,255,.4);
}
.sidebar-nav a.active span { color: #3b260d; }
.sidebar-heading { padding: 17px 13px 5px; color: #747b7d; font-size: 10px; font-weight: 800; letter-spacing: 1.2px; text-transform: uppercase; }

.sidebar-contact {
    display: grid;
    gap: 8px;
    margin-top: auto;
    padding: 15px;
    border: 1px solid rgba(196, 40, 42, .35);
    border-radius: 12px;
    background: linear-gradient(145deg, rgba(123, 13, 17, .85), rgba(66, 9, 12, .8));
    font-size: 12px;
    color: #e4dcdc;
}
.sidebar-contact strong { color: #f3bf58; font-size: 15px; }
.sidebar-contact a { color: #f4ce7d; font-weight: 700; margin-top: 3px; }
.sidebar-logout { margin-top: 12px; }
.sidebar-logout button {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 10px;
    color: #d5d5d5;
    background: rgba(255,255,255,.025);
    cursor: pointer;
}
.sidebar-logout button:hover { color: white; border-color: rgba(226, 77, 79, .45); background: rgba(158, 22, 25, .12); }

.admin-main { min-height: 100vh; margin-left: var(--sidebar-width); transition: margin-left .24s ease; }
.admin-topbar {
    position: sticky;
    z-index: 25;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 84px;
    padding: 13px clamp(20px, 3vw, 42px);
    border-bottom: 1px solid rgba(218, 166, 63, .14);
    background: rgba(8, 11, 12, .9);
    backdrop-filter: blur(18px);
}
.topbar-title { display: flex; align-items: center; gap: 13px; }
.topbar-title span { color: #827b70; font-size: 11px; letter-spacing: .35px; }
.topbar-title h1 { margin: 1px 0 0; font-size: clamp(20px, 2vw, 27px); line-height: 1.25; }
.sidebar-toggle { display: none; width: 42px; height: 42px; border: 1px solid var(--admin-line); border-radius: 10px; color: var(--admin-gold-light); background: var(--admin-panel); cursor: pointer; }
.admin-topbar-actions { display: flex; align-items: center; gap: 9px; }
.admin-tool-button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 40px; padding: 8px 11px; border: 1px solid var(--admin-line); border-radius: 10px; color: var(--admin-text); background: var(--admin-panel); cursor: pointer; transition: .18s ease; }
.admin-tool-button:hover { border-color: var(--admin-line-strong); color: var(--admin-gold-light); transform: translateY(-1px); }
.admin-tool-button > span { color: var(--admin-gold); font-size: 17px; line-height: 1; }
.admin-tool-button > b { font-size: 10px; white-space: nowrap; }
.admin-profile { display: flex; align-items: center; gap: 10px; }
.admin-profile:hover strong { color: var(--admin-gold-light); }
.admin-profile strong, .admin-profile span { display: block; }
.admin-profile strong { font-size: 13px; }
.admin-profile span { margin-top: 2px; color: var(--admin-muted); font-size: 11px; text-transform: uppercase; }
.profile-avatar { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid #d8a345; border-radius: 50%; color: #221605; font-weight: 900; background: linear-gradient(135deg, #f2ce7c, #b87118); }

@media (min-width: 981px) {
    .admin-body.sidebar-collapsed .admin-sidebar { width: var(--sidebar-collapsed-width); padding-inline: 10px; }
    .admin-body.sidebar-collapsed .admin-main { margin-left: var(--sidebar-collapsed-width); }
    .admin-body.sidebar-collapsed .sidebar-brand { justify-content: center; min-height: 68px; padding: 7px; }
    .admin-body.sidebar-collapsed .sidebar-brand img.farm-logo-image { width: 54px; height: 54px; }
    .admin-body.sidebar-collapsed .sidebar-brand-copy,
    .admin-body.sidebar-collapsed .sidebar-heading,
    .admin-body.sidebar-collapsed .sidebar-contact,
    .admin-body.sidebar-collapsed .sidebar-nav a > b,
    .admin-body.sidebar-collapsed .sidebar-logout button > b { display: none; }
    .admin-body.sidebar-collapsed .sidebar-nav { gap: 7px; }
    .admin-body.sidebar-collapsed .sidebar-nav a { justify-content: center; min-height: 48px; padding: 8px; }
    .admin-body.sidebar-collapsed .sidebar-nav a span { width: auto; }
    .admin-body.sidebar-collapsed .sidebar-nav a:hover { transform: translateY(-1px); }
    .admin-body.sidebar-collapsed .sidebar-logout button { display: grid; place-items: center; min-height: 46px; padding: 8px; }
}

.admin-content { width: min(1580px, 100%); margin: 0 auto; padding: clamp(22px, 3vw, 40px); }
.gold-kicker { display: block; color: var(--admin-gold); font-size: 10px; font-weight: 800; letter-spacing: 1.35px; }

.panel, .panel-gold-edge {
    border: 1px solid var(--admin-line);
    border-radius: 15px;
    background: linear-gradient(145deg, rgba(255,255,255,.018), transparent 50%), var(--admin-panel);
    box-shadow: var(--admin-shadow);
}
.panel-gold-edge { border-color: rgba(218, 166, 63, .37); }
.dashboard-hero {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 150px;
    padding: 25px 32px;
    overflow: hidden;
    background:
        radial-gradient(circle at 90% 30%, rgba(220, 164, 56, .26), transparent 22rem),
        linear-gradient(100deg, #15191b, #0c0f10);
}
.dashboard-hero::before { content: ""; position: absolute; inset: 0; opacity: .09; background: repeating-linear-gradient(120deg, transparent 0 18px, #dbac55 19px 20px); mask-image: linear-gradient(90deg, transparent 35%, black); }
.dashboard-hero > div, .dashboard-hero img { position: relative; z-index: 1; }
.dashboard-hero h2 { margin: 6px 0 5px; font-size: clamp(24px, 3vw, 35px); }
.dashboard-hero p { margin: 0; color: var(--admin-muted); font-size: 14px; }
.dashboard-hero img { align-self: flex-end; width: 118px; max-height: 135px; margin: -10px 30px -25px 20px; object-fit: contain; filter: drop-shadow(0 15px 18px rgba(0,0,0,.6)); }

.stats-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: 18px; }
.stat-card {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 13px;
    min-height: 120px;
    padding: 19px;
    border: 1px solid var(--admin-line);
    border-radius: 14px;
    background: linear-gradient(145deg, rgba(255,255,255,.025), transparent), var(--admin-panel);
    box-shadow: 0 16px 40px rgba(0,0,0,.22);
    transition: .2s ease;
}
.stat-card:hover { transform: translateY(-3px); border-color: var(--admin-line-strong); }
.stat-card > b { color: var(--admin-gold); font-size: 18px; }
.stat-card div { min-width: 0; }
.stat-card small, .stat-card strong, .stat-card em { display: block; }
.stat-card small { color: #b7babb; font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.stat-card strong { display: inline-block; margin-top: 7px; color: var(--admin-gold-light); font-family: Georgia, serif; font-size: 30px; line-height: 1; }
.stat-card em { display: inline-block; margin-left: 5px; color: #898f91; font-size: 11px; font-style: normal; }
.stat-icon { display: grid; place-items: center; width: 45px; height: 45px; border-radius: 12px; font-size: 22px; }
.stat-icon.gold { color: #ffd77f; background: rgba(218,166,63,.13); }
.stat-icon.green { color: #69d89e; background: rgba(67,189,129,.12); }
.stat-icon.blue { color: #75bcf4; background: rgba(77,157,224,.12); }
.stat-icon.red { color: #f27678; background: rgba(158,22,25,.18); }
.stat-total { border-color: rgba(158, 22, 25, .42); background: linear-gradient(145deg, rgba(158,22,25,.16), transparent), var(--admin-panel); }

.quick-grid { display: grid; grid-template-columns: repeat(3, 1fr) 1.25fr; gap: 10px; margin: 12px 0 18px; }
.quick-item, .quick-action { display: flex; align-items: center; gap: 11px; min-height: 64px; padding: 12px 16px; border: 1px solid rgba(255,255,255,.055); border-radius: 11px; background: rgba(255,255,255,.018); }
.quick-item > span { color: var(--admin-gold); font-size: 21px; }
.quick-item small, .quick-item strong { display: block; }
.quick-item small { color: var(--admin-muted); font-size: 11px; }
.quick-item strong { margin-top: 2px; font-size: 18px; }
.quick-action { justify-content: center; color: #171008; font-weight: 800; background: linear-gradient(135deg, #e8bc62, #b6711b); }
.quick-action:hover { filter: brightness(1.08); }

.content-grid { display: grid; gap: 16px; }
.dashboard-grid { grid-template-columns: minmax(0, 2fr) minmax(280px, .75fr); margin-bottom: 18px; }
.panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.panel-heading span { color: var(--admin-muted); font-size: 10px; }
.panel-heading h3 { margin: 3px 0 0; font-size: 18px; }
.panel-heading a { color: var(--admin-gold); font-size: 12px; font-weight: 700; }
.chart-panel, .summary-panel { padding: 22px; }
.prototype-tag { padding: 5px 9px; border: 1px solid rgba(218,166,63,.3); border-radius: 20px; color: var(--admin-gold) !important; background: rgba(218,166,63,.07); }
.chart-wrap { position: relative; width: 100%; height: 315px; }
.chart-wrap canvas { width: 100%; height: 100%; }
.chart-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 18px; padding-top: 13px; color: #aab0b1; font-size: 11px; }
.chart-legend span { display: flex; align-items: center; gap: 6px; }
.chart-legend i { width: 8px; height: 8px; border-radius: 50%; background: var(--legend-color); box-shadow: 0 0 9px var(--legend-color); }

.summary-panel { display: flex; flex-direction: column; }
.summary-ring { --progress: 0; display: grid; place-items: center; width: 154px; aspect-ratio: 1; margin: 8px auto 20px; border-radius: 50%; background: conic-gradient(var(--admin-gold) calc(var(--progress) * 1%), #252a2c 0); box-shadow: 0 0 28px rgba(218,166,63,.08); }
.summary-ring::before { content: ""; grid-area: 1/1; width: 118px; aspect-ratio: 1; border-radius: 50%; background: var(--admin-panel); }
.summary-ring div { z-index: 1; grid-area: 1/1; text-align: center; }
.summary-ring strong, .summary-ring span { display: block; }
.summary-ring strong { color: var(--admin-gold-light); font: 700 30px Georgia, serif; }
.summary-ring span { margin-top: 2px; color: var(--admin-muted); font-size: 10px; }
.summary-row { display: flex; justify-content: space-between; padding: 11px 0; border-top: 1px solid rgba(255,255,255,.055); color: #b8bdbd; font-size: 12px; }
.summary-row strong { color: white; font-size: 15px; }
.text-warning { color: var(--admin-gold) !important; }

.analytics-page-actions { align-items: center; }
.analytics-action-group { display: flex; align-items: center; gap: 9px; }
.analytics-action-group form { margin: 0; }
.analytics-status-strip { display: grid; grid-template-columns: .75fr 1fr .7fr 1.4fr; gap: 1px; margin-bottom: 16px; padding: 1px; overflow: hidden; }
.analytics-status-strip > div { display: grid; align-content: center; min-width: 0; min-height: 75px; padding: 13px 16px; background: rgba(255,255,255,.018); }
.analytics-status-strip > div:first-child { grid-template-columns: auto 1fr; align-items: center; gap: 11px; }
.analytics-status-strip small, .analytics-status-strip strong { display: block; }
.analytics-status-strip small { color: var(--admin-muted); font-size: 9px; }
.analytics-status-strip strong { margin-top: 4px; overflow: hidden; color: #d7dada; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.analytics-status-dot { width: 11px; height: 11px; border-radius: 50%; background: #7b3436; box-shadow: 0 0 0 5px rgba(158,22,25,.13); }
.analytics-status-dot.is-ready { background: var(--admin-green); box-shadow: 0 0 0 5px rgba(67,189,129,.12), 0 0 14px rgba(67,189,129,.3); }
.analytics-setup { display: grid; grid-template-columns: 150px minmax(0, 720px); justify-content: center; align-items: center; gap: clamp(25px,5vw,60px); padding: clamp(30px,6vw,70px); }
.analytics-setup-icon { display: grid; place-items: center; width: 150px; aspect-ratio: 1; border: 1px solid rgba(218,166,63,.5); border-radius: 38px; color: #181109; background: linear-gradient(145deg, #f2d17e, #ad6715); box-shadow: 0 26px 60px rgba(183,111,20,.22); font: 900 43px Georgia,serif; }
.analytics-setup h3 { margin: 7px 0 8px; font-size: clamp(23px,3vw,34px); }
.analytics-setup > div > p { max-width: 720px; margin: 0; color: var(--admin-muted); font-size: 12px; line-height: 1.75; }
.analytics-setup ol { display: grid; gap: 8px; margin: 22px 0; padding: 0; list-style: none; }
.analytics-setup li { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 12px; padding: 12px; border: 1px solid rgba(255,255,255,.065); border-radius: 10px; background: rgba(255,255,255,.018); }
.analytics-setup li > b { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; color: #241705; background: linear-gradient(135deg,#efd07d,#b5721d); }
.analytics-setup li strong, .analytics-setup li small { display: block; }
.analytics-setup li strong { color: #dadddd; font-size: 12px; }
.analytics-setup li small { margin-top: 2px; color: var(--admin-muted); font-size: 9px; }
.analytics-error { display: grid; gap: 5px; padding: 18px; }
.analytics-error strong { font-size: 14px; }
.analytics-error span { color: #f2b0b1; }
.analytics-error p { margin: 2px 0 0; color: #ac9697; }
.analytics-filter { display: flex; align-items: end; gap: 10px; margin-bottom: 16px; padding: 14px; }
.analytics-filter label { display: grid; gap: 5px; }
.analytics-filter label span { color: var(--admin-muted); font-size: 9px; font-weight: 800; }
.analytics-filter select { min-width: 190px; }
.analytics-filter p { align-self: center; margin: 17px 0 0 auto; color: #737b7d; font-size: 9px; }
.analytics-kpi-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 13px; }
.analytics-kpi { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 14px; min-height: 116px; padding: 18px; }
.analytics-kpi small, .analytics-kpi strong, .analytics-kpi em { display: block; }
.analytics-kpi small { color: #b7babb; font-size: 11px; }
.analytics-kpi strong { margin-top: 5px; color: var(--admin-gold-light); font: 700 29px Georgia,serif; }
.analytics-kpi em { margin-top: 3px; color: #747c7e; font-size: 9px; font-style: normal; }
.analytics-secondary-stats { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin: 10px 0 16px; }
.analytics-secondary-stats > div { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 12px 16px; border: 1px solid rgba(255,255,255,.055); border-radius: 10px; background: rgba(255,255,255,.018); }
.analytics-secondary-stats small { color: var(--admin-muted); font-size: 10px; }
.analytics-secondary-stats strong { color: #dedfdb; font-size: 13px; }
.analytics-overview-grid { grid-template-columns: minmax(0,1.75fr) minmax(290px,.72fr); margin-bottom: 16px; }
.analytics-chart-panel { min-width: 0; }
.analytics-live-tag { padding: 5px 9px; border: 1px solid rgba(67,189,129,.28); border-radius: 20px; color: #6cd9a1 !important; background: rgba(67,189,129,.07); }
.analytics-breakdown { min-width: 0; padding: 22px; }
.analytics-bars { display: grid; gap: 15px; }
.analytics-bar-row > div { display: flex; justify-content: space-between; gap: 10px; }
.analytics-bar-row strong { color: #d9dddd; font-size: 10px; }
.analytics-bar-row span { color: #747c7d; font-size: 8px; text-align: right; }
.analytics-bar-row > i { display: block; height: 7px; margin-top: 7px; overflow: hidden; border-radius: 10px; background: #24292b; }
.analytics-bar-row > i b { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#9a641a,#e9bb5b); box-shadow: 0 0 12px rgba(218,166,63,.25); }
.analytics-detail-grid { grid-template-columns: minmax(0,1.5fr) minmax(300px,.7fr); }
.analytics-detail-grid > * { min-width: 0; }
.analytics-table { min-width: 560px; }
.analytics-table td:nth-child(2), .analytics-table td:nth-child(3) { color: var(--admin-gold-light); font: 700 14px Georgia,serif; }
.analytics-device-list { display: grid; gap: 9px; }
.analytics-device-list > div { position: relative; display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 11px; padding: 12px; overflow: hidden; border: 1px solid rgba(255,255,255,.055); border-radius: 10px; background: rgba(255,255,255,.015); }
.analytics-device-list > div > span { position: relative; z-index: 1; }
.analytics-device-list strong, .analytics-device-list small { display: block; }
.analytics-device-list strong { color: #d8dddd; font-size: 11px; }
.analytics-device-list small { margin-top: 2px; color: var(--admin-muted); font-size: 8px; }
.analytics-device-list > div > i { position: absolute; inset: auto 0 0; width: var(--device-progress); height: 2px; background: linear-gradient(90deg,#9b6215,#ecc369); }
.analytics-device-icon { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 9px; color: var(--admin-gold-light); background: rgba(218,166,63,.09); font-size: 19px; }

.table-panel { padding: 21px; }
.table-responsive { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; min-width: 760px; }
th, td { padding: 14px 13px; border-bottom: 1px solid rgba(255,255,255,.055); text-align: left; vertical-align: middle; }
th { color: #858d8e; font-size: 10px; font-weight: 700; letter-spacing: .2px; }
td { color: #d2d5d5; font-size: 12px; }
td strong, td small { display: block; }
td small { max-width: 280px; margin-top: 4px; color: #777f81; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
tbody tr { transition: .18s ease; }
tbody tr:hover { background: rgba(218,166,63,.025); }
.certificate-link { color: var(--admin-gold-light); font-weight: 800; }
.table-action { padding: 6px 10px; border: 1px solid rgba(218,166,63,.26); border-radius: 7px; color: var(--admin-gold); background: transparent; cursor: pointer; font-size: 11px; white-space: nowrap; }
.table-action:hover { border-color: var(--admin-gold); background: rgba(218,166,63,.08); }
.table-action.danger { color: #ec7779; border-color: rgba(226,77,79,.26); }
.certificate-action-group { flex-wrap: nowrap; }
.certificate-action-group .table-action { min-width: 52px; text-align: center; }
.certificate-action-view { color: #7cc7f4; border-color: rgba(85,171,222,.32); }
.certificate-action-edit { color: var(--admin-gold-light); }
.certificate-action-clone { color: #9cd7b5; border-color: rgba(91,196,142,.3); }
.row-actions { display: flex; align-items: center; gap: 7px; }
.row-actions form { margin: 0; }
.row-actions .clone-form { flex: 1; }
.row-actions .clone-form .btn { width: 100%; }

.status { display: inline-flex; align-items: center; justify-content: center; min-width: 74px; padding: 5px 9px; border: 1px solid currentColor; border-radius: 20px; font-size: 10px; white-space: nowrap; }
.status-approved { color: #5bd492; background: rgba(67,189,129,.08); }
.status-pending { color: #e7b54d; background: rgba(218,166,63,.08); }
.status-draft { color: #9ba3a5; background: rgba(155,163,165,.06); }
.status-revoked { color: #ed696c; background: rgba(158,22,25,.12); }

.empty-state { display: grid; place-items: center; gap: 7px; padding: 38px; color: var(--admin-muted); text-align: center; }
.empty-state > span:first-child { color: var(--admin-gold); font-size: 31px; }
.empty-state strong { color: #d9dddd; font-size: 15px; }
.empty-state a { color: var(--admin-gold); font-size: 12px; text-decoration: underline; text-underline-offset: 3px; }

.page-actions { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.page-actions h2 { margin: 5px 0 4px; font-size: clamp(24px, 3vw, 34px); }
.page-actions p { margin: 0; color: var(--admin-muted); font-size: 13px; }
.button-group { display: flex; gap: 9px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 10px 17px; border: 1px solid transparent; border-radius: 9px; cursor: pointer; font-size: 12px; font-weight: 800; transition: .2s ease; }
.btn:hover { transform: translateY(-1px); filter: brightness(1.06); }
.btn-gold { color: #1c1207; border-color: #edc874; background: linear-gradient(135deg, #f1ce7e, #b8751c); box-shadow: 0 9px 24px rgba(181,113,25,.18); }
.btn-outline { color: var(--admin-gold-light); border-color: rgba(218,166,63,.43); background: rgba(218,166,63,.035); }
.btn-ghost { color: #c2c6c6; border-color: rgba(255,255,255,.11); background: rgba(255,255,255,.025); }
.btn-block { width: 100%; }

.filter-bar { display: grid; grid-template-columns: minmax(260px, 1fr) 210px 170px auto auto; gap: 9px; padding: 14px; margin-bottom: 15px; }
.filter-bar select, .filter-bar input { min-height: 42px; }
.search-field { display: flex; align-items: center; gap: 8px; min-height: 42px; padding: 0 12px; border: 1px solid rgba(255,255,255,.1); border-radius: 9px; background: #0b0e10; }
.search-field span { color: var(--admin-gold); font-size: 18px; }
.search-field input { width: 100%; border: 0; outline: 0; color: white; background: transparent; }
.keyword-filter { display: grid; grid-template-columns: minmax(260px, 1fr) auto auto; gap: 9px; padding: 14px; margin-bottom: 16px; }
.keyword-filter .search-field { min-width: 0; }
.keyword-filter .btn { min-width: 104px; }

.admin-form { padding: clamp(20px, 3vw, 30px); }
.form-section + .form-section { padding-top: 27px; margin-top: 27px; border-top: 1px solid rgba(255,255,255,.065); }
.form-section-title { display: flex; align-items: center; gap: 13px; margin-bottom: 20px; }
.form-section-title > span { display: grid; place-items: center; width: 43px; height: 43px; border: 1px solid rgba(218,166,63,.42); border-radius: 10px; color: var(--admin-gold-light); font: 700 13px Georgia, serif; background: rgba(218,166,63,.07); }
.form-section-title h3 { margin: 0; font-size: 17px; }
.form-section-title p { margin: 3px 0 0; color: var(--admin-muted); font-size: 11px; }
.form-grid { display: grid; gap: 16px; }
.form-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.form-field { display: grid; gap: 7px; }
.form-field.full { grid-column: 1 / -1; }
.form-field > span { color: #c6caca; font-size: 11px; font-weight: 700; }
.form-field > small { color: #767e80; font-size: 10px; }
input, select, textarea {
    width: 100%;
    min-height: 43px;
    padding: 10px 12px;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 9px;
    outline: none;
    color: var(--admin-text);
    background: #0b0e10;
    transition: .18s ease;
}
textarea { resize: vertical; line-height: 1.6; }
input:focus, select:focus, textarea:focus { border-color: rgba(218,166,63,.7); box-shadow: 0 0 0 3px rgba(218,166,63,.08); }
input::placeholder, textarea::placeholder { color: #565d5f; }
select { color-scheme: dark; }
.form-actions { display: flex; justify-content: flex-end; gap: 9px; padding-top: 23px; margin-top: 25px; border-top: 1px solid rgba(255,255,255,.065); }
.content-editor { min-height: 300px; }
.form-hint { margin: -4px 0 17px; padding: 11px 12px; border-left: 2px solid var(--admin-gold); color: var(--admin-muted); background: rgba(218,166,63,.045); font-size: 11px; line-height: 1.6; }

.homepage-popup-admin-grid { display: grid; grid-template-columns: minmax(0, 1fr) 350px; align-items: start; gap: 17px; }
.homepage-popup-preview-panel { position: sticky; top: 96px; padding: 21px; }
.popup-display-options { margin-bottom: 17px; }
.popup-media-editor-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.popup-media-editor { min-width: 0; padding: 15px; border: 1px solid rgba(218,166,63,.18); border-radius: 12px; background: #090c0d; }
.popup-upload-preview, .popup-admin-video-preview { position: relative; display: grid; place-items: center; width: 100%; aspect-ratio: 16 / 10; margin-bottom: 14px; overflow: hidden; border: 1px dashed rgba(218,166,63,.38); border-radius: 10px; color: var(--admin-gold); background: #050708; }
.popup-upload-preview img, .popup-admin-video-preview video { width: 100%; height: 100%; object-fit: contain; }
.popup-upload-preview span, .popup-admin-video-preview > span { font-size: 36px; }
.popup-upload-preview small, .popup-admin-video-preview > small { position: absolute; bottom: 12px; color: var(--admin-muted); font-size: 10px; }
.popup-illustration-preview img { padding: 10px; }
.popup-remove-toggle { margin-top: 13px; padding: 11px; }
.popup-video-editor { display: grid; grid-template-columns: minmax(300px, .9fr) minmax(0, 1fr); align-items: center; gap: 20px; }
.popup-admin-video-preview { margin: 0; aspect-ratio: 16 / 9; }
.popup-admin-copy-preview { position: relative; padding: 25px 18px 20px; overflow: hidden; border: 2px solid #b9832e; border-radius: 20px; color: #2b2018; text-align: center; background: radial-gradient(circle at 82% 20%, rgba(225,190,121,.2), transparent 30%), #fff8e9; box-shadow: inset 0 0 0 4px #f1d8a3; }
.popup-admin-logo { display: block; width: 54px; height: 54px; margin: 0 auto 7px; object-fit: cover; border: 2px solid rgba(185,131,46,.65); border-radius: 14px; box-shadow: 0 5px 14px rgba(61,38,12,.2); }
.popup-admin-copy-preview > small { display: block; color: #7a5a2d; font-size: 11px; font-weight: 800; white-space: pre-line; }
.popup-admin-copy-preview h3 { margin: 5px 0 9px; color: #2b2018; font-size: 27px; line-height: 1.08; white-space: pre-line; }
.popup-admin-copy-preview p { margin: 0; color: #64564d; font-size: 11px; line-height: 1.65; white-space: pre-line; }
.popup-admin-copy-preview b { display: inline-block; margin-top: 15px; padding: 6px 10px; border-radius: 20px; color: #fff; background: #9d0d12; font-size: 9px; }
.homepage-popup-preview-panel .form-hint { margin: 15px 0 0; }

.certificate-types { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.certificate-types label { position: relative; cursor: pointer; }
.certificate-types input { position: absolute; opacity: 0; pointer-events: none; }
.certificate-types label > span { display: grid; justify-items: center; gap: 6px; min-height: 150px; padding: 20px 15px; border: 1px solid rgba(255,255,255,.1); border-radius: 12px; text-align: center; background: #0c1012; transition: .2s ease; }
.certificate-types b { color: var(--admin-gold); font-size: 28px; }
.certificate-types strong { font-size: 14px; }
.certificate-types small { color: var(--admin-muted); font-size: 10px; }
.certificate-types input:checked + span { border-color: var(--admin-gold); background: linear-gradient(145deg, rgba(218,166,63,.14), rgba(218,166,63,.035)); box-shadow: 0 0 0 2px rgba(218,166,63,.08), inset 0 1px rgba(255,255,255,.06); }
[data-type-field][hidden] { display: none; }

.certificate-source-modes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.certificate-source-option { position: relative; cursor: pointer; }
.certificate-source-option input { position: absolute; opacity: 0; pointer-events: none; }
.certificate-source-option > span { display: grid; grid-template-columns: 42px 1fr; align-items: center; min-height: 94px; padding: 16px; border: 1px solid rgba(255,255,255,.1); border-radius: 12px; background: #0b0f11; transition: .2s ease; }
.certificate-source-option b { grid-row: 1 / 3; display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid rgba(218,166,63,.3); border-radius: 50%; color: var(--admin-gold-light); background: rgba(218,166,63,.08); font-size: 18px; }
.certificate-source-option strong { color: #ece3cf; font-size: 13px; }
.certificate-source-option small { margin-top: 4px; color: var(--admin-muted); font-size: 9px; line-height: 1.5; }
.certificate-source-option input:checked + span { border-color: var(--admin-gold); background: linear-gradient(145deg, rgba(218,166,63,.14), rgba(218,166,63,.035)); box-shadow: 0 0 0 2px rgba(218,166,63,.08), inset 0 1px rgba(255,255,255,.05); }
.certificate-profile-source { display: grid; grid-template-columns: minmax(0, 1fr) minmax(330px, .85fr); align-items: end; gap: 14px; margin-top: 15px; padding: 16px; border: 1px solid rgba(218,166,63,.18); border-radius: 13px; background: linear-gradient(145deg, rgba(218,166,63,.05), transparent), #090c0d; }
.certificate-profile-source[hidden] { display: none; }
.certificate-profile-source .breeder-select-preview { margin-top: 0; }
.certificate-manual-note { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: 15px 0 0; padding: 15px 16px; border: 1px dashed rgba(218,166,63,.32); border-radius: 11px; color: var(--admin-muted); background: rgba(218,166,63,.045); font-size: 10px; }
.certificate-manual-note[hidden] { display: none; }
.certificate-manual-note strong { color: var(--admin-gold-light); font-size: 12px; }

.certificate-parent-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.certificate-parent-card { min-width: 0; padding: 18px; border: 1px solid rgba(218,166,63,.2); border-radius: 13px; background: linear-gradient(145deg, rgba(218,166,63,.045), transparent), #0b0e10; }
.certificate-parent-card > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 15px; }
.certificate-parent-card > header strong, .certificate-parent-card > header span { display: block; }
.certificate-parent-card > header strong { color: var(--admin-gold-light); font-size: 14px; }
.certificate-parent-card > header span { margin-top: 3px; color: var(--admin-muted); font-size: 9px; }
.certificate-parent-card > header b { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid var(--admin-line-strong); border-radius: 50%; color: var(--admin-gold-light); font-size: 18px; background: rgba(218,166,63,.08); }
.breeder-select-preview { display: grid; grid-template-columns: 92px 1fr; align-items: center; gap: 14px; min-height: 112px; margin-top: 13px; padding: 10px; border: 1px solid rgba(255,255,255,.075); border-radius: 11px; background: #080b0c; }
.breeder-select-photo { display: grid; place-items: center; width: 92px; height: 92px; overflow: hidden; border-radius: 9px; color: var(--admin-gold); background: #111618; }
.breeder-select-photo img { width: 100%; height: 100%; object-fit: cover; }
.breeder-select-preview small, .breeder-select-preview strong, .breeder-select-preview p { display: block; }
.breeder-select-preview small { color: var(--admin-gold); font-size: 9px; }
.breeder-select-preview strong { margin-top: 3px; color: #e2e5e3; font-size: 13px; }
.breeder-select-preview p { margin: 5px 0 0; color: var(--admin-muted); font-size: 10px; line-height: 1.5; }
.breeder-select-preview.is-empty { opacity: .72; }

.certificate-image-upload-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.certificate-image-upload { min-width: 0; padding: 13px; border: 1px solid rgba(218,166,63,.17); border-radius: 12px; background: #0a0d0e; }
.certificate-image-preview { position: relative; display: grid; place-items: center; width: 100%; aspect-ratio: 4 / 3; margin-bottom: 13px; overflow: hidden; border: 1px dashed rgba(218,166,63,.4); border-radius: 9px; color: var(--admin-gold); background: #080a0b; }
.certificate-image-preview img { position: absolute; inset: 0; width: 100%; height: 100%; padding: 7px; object-fit: contain; background: #f7f1e6; }
.certificate-image-preview > span { font-size: 30px; }
.certificate-image-preview > small { position: absolute; left: 8px; bottom: 8px; z-index: 1; padding: 5px 8px; border-radius: 12px; color: #f8e6b8; background: rgba(13,10,7,.78); font-size: 9px; }
.certificate-image-upload .form-field { margin: 0; }
.certificate-image-upload .form-field > small { margin-top: 6px; color: var(--admin-muted); font-size: 9px; }
.certificate-image-toggle { margin: 0 0 12px; padding: 11px; }
.certificate-image-toggle strong { font-size: 11px; }
.certificate-image-toggle small { font-size: 9px; }
.certificate-image-visibility { margin-bottom: 12px !important; }
.certificate-image-upload.is-excluded-from-certificate { border-color: rgba(226,77,79,.3); background: rgba(115,20,23,.08); }
.certificate-image-upload.is-excluded-from-certificate .certificate-image-preview { opacity: .32; filter: grayscale(1); }
.certificate-image-upload.is-excluded-from-certificate > .form-field:last-child { opacity: .45; }

.certificate-detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 16px; }
.certificate-preview { min-height: 590px; padding: clamp(24px, 4vw, 46px); border-color: rgba(218,166,63,.48); background: radial-gradient(circle at 50% 40%, rgba(218,166,63,.075), transparent 22rem), linear-gradient(145deg, #161a1c, #0d1112); }
.certificate-preview-head { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; padding-bottom: 20px; border-bottom: 1px solid var(--admin-line); }
.certificate-preview-head img { width: 72px; height: 72px; object-fit: contain; }
.certificate-preview-head img.farm-logo-image { border-radius: 18px; }
.certificate-preview-head span { color: var(--admin-gold); font-size: 10px; }
.certificate-preview-head h3 { margin: 3px 0 0; font-size: 24px; }
.certificate-number { display: grid; place-items: center; gap: 5px; padding: 29px 0; text-align: center; }
.certificate-number span { color: var(--admin-muted); font-size: 11px; }
.certificate-number strong { color: var(--admin-gold-light); font: 700 clamp(25px,4vw,38px) Georgia, serif; letter-spacing: 1px; }
.detail-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin: 0; border: 1px solid rgba(255,255,255,.07); border-radius: 11px; overflow: hidden; background: rgba(255,255,255,.07); }
.detail-list div { padding: 14px 16px; background: #101416; }
.detail-list dt { color: #7e8788; font-size: 10px; }
.detail-list dd { margin: 5px 0 0; color: #e6e8e5; font-size: 13px; font-weight: 700; }
.certificate-note { margin-top: 17px; padding: 14px; border-left: 2px solid var(--admin-gold); background: rgba(218,166,63,.045); }
.certificate-note span { color: var(--admin-gold); font-size: 10px; }
.certificate-note p { margin: 5px 0 0; color: #bec2c1; font-size: 12px; line-height: 1.6; }
.certificate-media-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 240px)); justify-content: center; gap: 10px; margin-top: 17px; }
.certificate-media-grid.image-count-1 { grid-template-columns: minmax(0, 340px); }
.certificate-media-grid.image-count-2 { grid-template-columns: repeat(2, minmax(0, 290px)); }
.certificate-media-card { min-width: 0; padding: 0; overflow: hidden; border: 1px solid rgba(218,166,63,.2); border-radius: 10px; color: var(--admin-text); text-align: left; background: #080b0c; cursor: zoom-in; }
.certificate-media-card img { width: 100%; height: 190px; padding: 8px; object-fit: contain; background: #f7f1e6; transition: transform .2s ease; }
.certificate-media-card:hover img { transform: scale(1.035); }
.certificate-media-card span { display: grid; gap: 2px; padding: 9px; }
.certificate-media-card b { color: var(--admin-gold-light); font-size: 10px; }
.certificate-media-card small { overflow: hidden; color: var(--admin-muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.certificate-images-hidden { margin-top: 17px; padding: 12px 14px; border: 1px dashed rgba(218,166,63,.28); border-radius: 10px; color: var(--admin-muted); background: rgba(218,166,63,.035); font-size: 10px; }
.detail-side { display: grid; align-content: start; gap: 16px; }
.detail-side .panel { padding: 20px; }
.verification-box { text-align: center; }
.verification-icon { display: grid; place-items: center; width: 56px; height: 56px; margin: 0 auto 13px; border: 1px solid var(--admin-gold); border-radius: 50%; color: #191106; font-size: 25px; background: linear-gradient(135deg, #f0cc79, #b7751c); box-shadow: 0 0 28px rgba(218,166,63,.17); }
.verification-box h3 { margin: 0 0 11px; font-size: 15px; }
.verification-box code { display: block; padding: 10px; border-radius: 8px; color: #b4bbbc; background: #080a0b; overflow-wrap: anywhere; font-size: 10px; }
.verification-box a { display: inline-block; margin-top: 13px; color: var(--admin-gold); font-size: 11px; }
.certificate-qr { display: grid; justify-items: center; gap: 7px; margin: 12px 0; }
.certificate-qr img { width: min(190px, 100%); aspect-ratio: 1; padding: 7px; border-radius: 10px; background: #fffaf0; }
.certificate-qr span { color: var(--admin-muted); font-size: 9px; }

.verify-hero { display: flex; align-items: center; gap: 21px; padding: 27px; background: radial-gradient(circle at 8% 50%, rgba(218,166,63,.14), transparent 16rem), var(--admin-panel); }
.verify-large-icon { display: grid; place-items: center; flex: 0 0 70px; height: 70px; border: 1px solid var(--admin-line-strong); border-radius: 16px; color: var(--admin-gold-light); font-size: 34px; background: rgba(218,166,63,.07); }
.verify-hero h2 { margin: 5px 0; font-size: clamp(22px,3vw,31px); }
.verify-hero p { margin: 0; color: var(--admin-muted); font-size: 12px; }
.verify-search { display: grid; grid-template-columns: 1fr auto; gap: 10px; max-width: 900px; padding: 16px; margin: 18px auto; }
.verify-search label { display: flex; align-items: center; gap: 10px; padding: 0 12px; border: 1px solid rgba(255,255,255,.11); border-radius: 9px; background: #090c0d; }
.verify-search label > span { color: var(--admin-gold); font-size: 22px; }
.verify-search input { border: 0; background: transparent; box-shadow: none; }
.verify-result { display: grid; grid-template-columns: auto 1fr minmax(300px, 1.4fr) auto; align-items: center; gap: 20px; max-width: 1100px; padding: 24px; margin: 0 auto; }
.verify-result.valid { border-color: rgba(67,189,129,.38); }
.verify-result.invalid { grid-template-columns: auto 1fr; border-color: rgba(226,77,79,.38); }
.result-mark { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 50%; color: #07140d; font-size: 28px; font-weight: 900; background: var(--admin-green); }
.invalid .result-mark { color: white; background: var(--admin-red); }
.result-main > span, .verify-result > div > span { color: var(--admin-green); font-size: 10px; font-weight: 800; }
.invalid > div > span { color: var(--admin-red-light); }
.result-main h3, .verify-result h3 { margin: 3px 0; color: var(--admin-gold-light); font: 700 22px Georgia, serif; }
.result-main p, .verify-result p { margin: 0; color: var(--admin-muted); font-size: 11px; }
.verify-result dl { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; margin: 0; }
.verify-result dl div { padding: 8px 10px; border-left: 1px solid var(--admin-line); }
.verify-result dt { color: var(--admin-muted); font-size: 9px; }
.verify-result dd { margin: 4px 0 0; font-size: 11px; }

.breeder-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.breeder-card { overflow: hidden; }
.breeder-image { position: relative; height: 210px; background: #090b0c; overflow: hidden; }
.breeder-image::after { content: ""; position: absolute; inset: auto 0 0; height: 45%; background: linear-gradient(transparent, #111517); }
.breeder-image img { width: 100%; height: 100%; object-fit: cover; }
.breeder-image .status { position: absolute; z-index: 1; top: 13px; right: 13px; background: rgba(10,13,14,.86); }
.breeder-body { padding: 18px; }
.breeder-code { color: var(--admin-gold); font: 700 10px Georgia, serif; letter-spacing: .7px; }
.breeder-body h3 { margin: 5px 0 3px; font-size: 20px; }
.breeder-body > p { margin: 0; color: var(--admin-muted); font-size: 11px; }
.breeder-body dl { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin: 15px 0; border-radius: 8px; overflow: hidden; background: rgba(255,255,255,.05); }
.breeder-body dl div { padding: 9px; background: #0c1012; }
.breeder-body dt { color: #727a7c; font-size: 9px; }
.breeder-body dd { margin: 3px 0 0; font-size: 11px; }
.breeder-body .row-actions { justify-content: space-between; }
.breeder-body .btn { flex: 1; min-height: 37px; }
.icon-danger { display: grid; place-items: center; width: 37px; height: 37px; border: 1px solid rgba(226,77,79,.28); border-radius: 8px; color: #e96e70; background: rgba(158,22,25,.08); cursor: pointer; font-size: 18px; }
.empty-card { grid-column: 1 / -1; }

.chicken-admin-image { height: 280px; }
.chicken-admin-image img { object-position: center 30%; }
.featured-badge { position: absolute; z-index: 2; left: 13px; bottom: 13px; padding: 6px 10px; border: 1px solid #f1cf7d; border-radius: 20px; color: #241706; background: linear-gradient(135deg, #f2d183, #bd7a20); font-size: 10px; font-weight: 900; }
.profile-linked-badge { position: absolute; z-index: 2; right: 13px; bottom: 13px; padding: 6px 10px; border-radius: 20px; color: #d9fce4; background: rgba(16, 119, 64, .86); font-size: 9px; font-weight: 900; }
.image-upload-layout { display: grid; grid-template-columns: 210px 1fr; align-items: center; gap: 22px; }
.image-preview { width: 210px; aspect-ratio: 4 / 5; display: grid; place-items: center; overflow: hidden; border: 1px dashed rgba(218,166,63,.5); border-radius: 13px; color: var(--admin-gold); background: #090c0d; }
.image-preview img { width: 100%; height: 100%; object-fit: cover; }
.image-preview span { font-size: 42px; }
.image-preview small { display: block; margin-top: -55px; color: var(--admin-muted); font-size: 10px; }
.featured-toggle { display: flex; align-items: center; gap: 12px; padding: 14px; border: 1px solid rgba(218,166,63,.22); border-radius: 10px; background: rgba(218,166,63,.045); cursor: pointer; }
.featured-toggle input { width: 18px; min-height: 18px; accent-color: var(--admin-gold); }
.existing-gallery, .gallery-upload-preview { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin: 18px 0; }
.gallery-admin-item { position: relative; overflow: hidden; border: 1px solid rgba(218,166,63,.22); border-radius: 10px; background: #090c0d; }
.gallery-admin-item img, .gallery-upload-preview img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
.gallery-admin-item span { display: flex; align-items: center; justify-content: center; gap: 5px; padding: 7px; color: #d8cbb8; font-size: 10px; cursor: pointer; }
.gallery-admin-item input { accent-color: #b9161c; }
.gallery-upload-preview:empty { display: none; }
.achievement-admin-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.achievement-admin-card { display: grid; grid-template-columns: 210px 1fr; overflow: hidden; }
.achievement-admin-image { position: relative; min-height: 330px; background: #080a0b; }
.achievement-admin-image img { width: 100%; height: 100%; object-fit: cover; }
.achievement-admin-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 55%, rgba(4,5,6,.75)); pointer-events: none; }
.achievement-admin-image .status { position: absolute; z-index: 2; top: 13px; right: 13px; background: rgba(8,10,11,.88); }
.achievement-admin-body { padding: 18px; }
.achievement-admin-body h3 { margin: 6px 0 8px; color: #edbd54; font-size: 22px; line-height: 1.15; }
.achievement-admin-body > p { min-height: 36px; margin: 0; color: var(--admin-muted); font-size: 11px; }
.achievement-admin-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; margin: 15px 0; }
.achievement-admin-stats span { display: grid; padding: 9px; border: 1px solid rgba(218,166,63,.16); border-radius: 8px; background: #0a0d0e; text-align: center; }
.achievement-admin-stats b { color: #ba8f3b; font-size: 9px; }
.achievement-admin-stats strong { color: #f1c75d; font: 800 22px Georgia, serif; }
.achievement-admin-stats small { color: #777f81; font-size: 8px; }
.achievement-admin-body .row-actions { justify-content: space-between; }
.achievement-admin-body .btn { flex: 1; }
.achievement-upload-layout { align-items: start; }
.achievement-image-preview { aspect-ratio: 4 / 5; }
.achievement-stat-editor { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.achievement-stat-editor fieldset { min-width: 0; padding: 15px; border: 1px solid rgba(218,166,63,.2); border-radius: 11px; background: rgba(218,166,63,.03); }
.achievement-stat-editor legend { padding: 0 8px; color: var(--admin-gold); font-size: 11px; font-weight: 900; }
.featured-toggle strong, .featured-toggle small { display: block; }
.featured-toggle strong { font-size: 12px; }
.featured-toggle small { margin-top: 3px; color: var(--admin-muted); font-size: 10px; }

.video-admin-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.video-admin-card { overflow: hidden; }
.video-admin-thumb { position: relative; display: block; height: 190px; overflow: hidden; background: #07090a; }
.video-admin-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
.video-admin-thumb > a { position: relative; display: block; width: 100%; height: 100%; }
.video-admin-thumb video, .youtube-form-preview video { display: block; width: 100%; height: 100%; object-fit: contain; background: #000; }
.video-admin-thumb:hover img { transform: scale(1.04); }
.video-admin-thumb span, .youtube-form-preview span { position: absolute; inset: 50% auto auto 50%; display: grid; place-items: center; width: 54px; height: 54px; padding-left: 4px; border: 2px solid white; border-radius: 50%; color: white; background: rgba(158,22,25,.88); transform: translate(-50%, -50%); }
.video-admin-body { padding: 18px; }
.video-meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.video-meta small { color: var(--admin-muted); font-size: 10px; }
.video-admin-body h3 { margin: 12px 0 5px; font-size: 17px; }
.video-admin-body p { min-height: 38px; margin: 0 0 15px; color: var(--admin-muted); font-size: 11px; line-height: 1.6; }
.video-admin-body .row-actions { justify-content: space-between; }
.video-admin-body .btn { flex: 1; min-height: 37px; }
.youtube-form-preview { position: relative; width: min(100%, 520px); aspect-ratio: 16 / 9; margin: 0 auto 24px; overflow: hidden; border: 2px solid var(--admin-line-strong); border-radius: 13px; }
.youtube-form-preview img { width: 100%; height: 100%; object-fit: cover; }

.management-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-bottom: 16px; }
.management-stats article { display: flex; align-items: baseline; gap: 8px; padding: 20px; }
.management-stats span { margin-right: auto; color: var(--admin-muted); font-size: 12px; }
.management-stats strong { color: var(--admin-gold-light); font: 700 30px Georgia, serif; }
.management-stats small { color: #777f81; font-size: 10px; }
.account-username { color: var(--admin-gold-light); font-weight: 800; }

.role-admin-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.role-admin-card { display: flex; flex-direction: column; min-height: 315px; padding: 21px; }
.role-admin-card header { display: grid; grid-template-columns: auto 1fr auto; align-items: start; gap: 12px; }
.role-icon { display: grid; place-items: center; width: 46px; height: 46px; border: 1px solid var(--admin-line-strong); border-radius: 12px; color: var(--admin-gold-light); background: rgba(218,166,63,.07); }
.role-admin-card header span:not(.status) { display: block; color: var(--admin-muted); font-size: 9px; font-weight: 800; letter-spacing: .8px; }
.role-admin-card h3 { margin: 3px 0 2px; font-size: 18px; }
.role-admin-card code { color: #8f9798; font-size: 10px; }
.role-admin-card > p { min-height: 46px; margin: 20px 0; color: var(--admin-muted); font-size: 11px; line-height: 1.7; }
.role-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 18px; }
.role-metrics div { display: grid; justify-items: center; gap: 3px; padding: 13px; border: 1px solid rgba(218,166,63,.15); border-radius: 9px; background: rgba(218,166,63,.03); }
.role-metrics strong { color: var(--admin-gold-light); font: 700 24px Georgia, serif; }
.role-metrics span { color: var(--admin-muted); font-size: 9px; }
.role-admin-card > .row-actions { margin-top: auto; }
.role-admin-card > .row-actions .btn { flex: 1; width: 100%; }
.role-admin-card > .row-actions form { flex: .5; }
.role-delete { color: #ed7779; border-color: rgba(226,77,79,.25); }

.permission-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.permission-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.permission-group { min-width: 0; padding: 16px; border: 1px solid rgba(218,166,63,.2); border-radius: 12px; background: rgba(218,166,63,.025); }
.permission-group legend { padding: 0 9px; color: var(--admin-gold-light); font-size: 11px; font-weight: 900; }
.permission-group > div { display: grid; gap: 8px; }
.permission-option { position: relative; display: block; cursor: pointer; }
.permission-option input { position: absolute; opacity: 0; pointer-events: none; }
.permission-option > span { position: relative; display: grid; gap: 4px; min-height: 70px; padding: 13px 13px 13px 46px; border: 1px solid rgba(255,255,255,.08); border-radius: 10px; background: #0b0e10; transition: .18s ease; }
.permission-option > span::before { content: ""; position: absolute; left: 14px; top: 19px; display: grid; place-items: center; width: 20px; height: 20px; border: 1px solid rgba(255,255,255,.18); border-radius: 6px; color: #1b1207; font-size: 12px; font-weight: 900; }
.permission-option b { color: #d4d7d7; font-size: 12px; }
.permission-option small { color: var(--admin-muted); font-size: 9px; line-height: 1.55; }
.permission-option input:checked + span { border-color: rgba(218,166,63,.65); background: linear-gradient(145deg, rgba(218,166,63,.13), rgba(218,166,63,.035)); }
.permission-option input:checked + span::before { content: "✓"; border-color: #eac36e; background: linear-gradient(135deg, #f1ce7e, #b8751c); }
.permission-option input:focus-visible + span { box-shadow: 0 0 0 3px rgba(218,166,63,.14); }
.permission-option input:disabled + span { cursor: not-allowed; opacity: .78; }

.account-security-grid { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 16px; align-items: start; }
.account-summary { display: grid; justify-items: center; padding: 28px 22px; text-align: center; }
.account-summary .profile-avatar { width: 68px; height: 68px; margin-bottom: 13px; font-size: 24px; }
.account-summary > span { color: var(--admin-muted); font-size: 10px; }
.account-summary h3 { margin: 5px 0 2px; color: var(--admin-gold-light); }
.account-summary > p { margin: 0; color: #899092; font-size: 11px; }
.account-summary dl { width: 100%; margin: 22px 0 0; }
.account-summary dl div { display: flex; justify-content: space-between; gap: 15px; padding: 11px 0; border-top: 1px solid rgba(255,255,255,.06); font-size: 11px; }
.account-summary dt { color: var(--admin-muted); }
.account-summary dd { margin: 0; font-weight: 800; }

.settings-grid { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(300px, .75fr); gap: 16px; }
.settings-signature-section { margin-top: 27px; padding-top: 25px; border-top: 1px solid rgba(218,166,63,.16); }
.settings-analytics-section { margin-top: 27px; padding-top: 25px; border-top: 1px solid rgba(218,166,63,.16); scroll-margin-top: 105px; }
.analytics-settings-toggle { margin-bottom: 18px; }
.analytics-credential-status { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 11px; padding: 12px 14px; border: 1px solid rgba(255,255,255,.075); border-radius: 10px; background: rgba(255,255,255,.02); }
.analytics-credential-status > span { min-width: 0; }
.analytics-credential-status strong, .analytics-credential-status small { display: block; }
.analytics-credential-status strong { overflow: hidden; color: #d9dddd; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.analytics-credential-status small { margin-top: 3px; color: var(--admin-muted); font-size: 9px; }
.analytics-credential-remove { flex: 0 0 auto; }
.consent-settings-card { margin-top: 16px; padding: 16px; border: 1px solid rgba(218,166,63,.16); border-radius: 12px; background: linear-gradient(135deg, rgba(218,166,63,.055), rgba(255,255,255,.018)); }
.consent-settings-card .analytics-settings-toggle { margin-bottom: 14px; }
.signature-preview { aspect-ratio: 16 / 7; background: #f8f4ea; }
.signature-preview img { padding: 10px; object-fit: contain; }
.signature-remove { margin-top: 12px; }
.settings-side { display: grid; align-content: start; gap: 16px; }
.system-info { padding: 20px; }
.system-info dl { margin: 0; }
.system-info dl div { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 11px 0; border-top: 1px solid rgba(255,255,255,.055); }
.system-info dt { color: var(--admin-muted); font-size: 11px; }
.system-info dd { margin: 0; font-size: 11px; }

.alert { margin-bottom: 14px; padding: 11px 14px; border: 1px solid; border-radius: 9px; font-size: 12px; line-height: 1.6; }
.alert ul { margin: 5px 0 0; padding-left: 20px; }
.alert-success { color: #7be0aa; border-color: rgba(67,189,129,.35); background: rgba(67,189,129,.09); }
.alert-error { color: #f08a8c; border-color: rgba(226,77,79,.35); background: rgba(158,22,25,.12); }
.alert-warning { color: #e8c36c; border-color: rgba(218,166,63,.35); background: rgba(218,166,63,.08); }
.alert-warning a { font-weight: 800; text-decoration: underline; }

body.swal2-shown .swal2-container { z-index: 20000; }
body.swal2-shown .swal2-popup.phet-swal-popup {
    width: min(92vw, 430px);
    padding: 28px 26px 24px;
    color: #f4ead8;
    background: radial-gradient(circle at 50% 0, rgba(218,166,63,.12), transparent 38%), #101415;
    border: 1px solid rgba(218,166,63,.5);
    border-radius: 18px;
    box-shadow: 0 28px 70px rgba(0,0,0,.58), inset 0 0 0 1px rgba(255,255,255,.025);
}
body.swal2-shown .phet-swal-title { padding: 0; color: #f4c860; font: 800 23px/1.3 Tahoma, sans-serif; }
body.swal2-shown .phet-swal-content { margin: 11px 0 0; color: #c9c2b7; font: 400 13px/1.75 Tahoma, sans-serif; }
body.swal2-shown .swal2-actions { gap: 9px; margin-top: 23px; }
body.swal2-shown .phet-swal-confirm,
body.swal2-shown .phet-swal-cancel {
    min-width: 105px;
    min-height: 40px;
    padding: 9px 18px;
    border-radius: 9px;
    cursor: pointer;
    font: 800 12px Tahoma, sans-serif;
}
body.swal2-shown .phet-swal-confirm { color: #261806; background: linear-gradient(135deg, #f2d27f, #bd7b21); border: 1px solid #edc96f; }
body.swal2-shown .phet-swal-cancel { color: #d4cbc0; background: #1a2022; border: 1px solid rgba(255,255,255,.14); }
body.swal2-shown .phet-swal-confirm:hover { filter: brightness(1.08); }
body.swal2-shown .phet-swal-cancel:hover { color: #fff; border-color: rgba(255,255,255,.28); }
body.swal2-shown .swal2-icon.swal2-success { border-color: #54ce91; color: #54ce91; }
body.swal2-shown .swal2-icon.swal2-error { border-color: #e9686c; color: #e9686c; }
body.swal2-shown .swal2-icon.swal2-warning { border-color: #e3ad45; color: #e3ad45; }
body.swal2-shown .swal2-timer-progress-bar { background: linear-gradient(90deg, #dca83e, #f5d77e); }
.phet-swal-error-list { margin: 0; padding-left: 20px; text-align: left; }
.phet-swal-error-list li + li { margin-top: 5px; }

.sidebar-backdrop { display: none; }

/* Login */
.login-body { min-height: 100vh; background: #07090a; }
.login-shell { display: grid; grid-template-columns: minmax(480px, 1.15fr) minmax(420px, .85fr); min-height: 100vh; }
.login-showcase { position: relative; display: flex; align-items: flex-end; min-height: 100vh; padding: clamp(35px, 6vw, 80px); overflow: hidden; border-right: 1px solid var(--admin-line); background: radial-gradient(circle at 36% 38%, rgba(218,166,63,.2), transparent 20rem), linear-gradient(145deg, #121617, #07090a); }
.login-showcase::before { content: ""; position: absolute; inset: 0; opacity: .11; background: repeating-linear-gradient(115deg, transparent 0 35px, #d29b35 36px 37px); mask-image: linear-gradient(to bottom, black, transparent 78%); }
.showcase-glow { position: absolute; left: 5%; top: 12%; width: 420px; aspect-ratio: 1; border: 1px solid rgba(218,166,63,.22); border-radius: 50%; box-shadow: 0 0 100px rgba(218,166,63,.08), inset 0 0 100px rgba(218,166,63,.05); }
.login-showcase > img { position: absolute; z-index: 1; left: 8%; top: 7%; width: min(39vw, 480px); height: 62%; object-fit: contain; object-position: bottom; filter: drop-shadow(0 35px 25px rgba(0,0,0,.6)); }
.showcase-copy { position: relative; z-index: 2; max-width: 650px; padding: 28px; border-left: 3px solid var(--admin-gold); background: linear-gradient(90deg, rgba(7,9,10,.82), transparent); }
.showcase-copy h1 { margin: 7px 0 10px; font-size: clamp(35px, 5vw, 64px); line-height: 1.05; }
.showcase-copy h1 em { color: var(--admin-gold-light); font-family: Georgia, serif; font-style: normal; }
.showcase-copy p { max-width: 600px; margin: 0; color: #aeb3b3; font-size: 14px; line-height: 1.7; }
.login-panel { display: grid; place-items: center; padding: 32px; background: radial-gradient(circle at 80% 20%, rgba(158,22,25,.12), transparent 18rem), #0b0e10; }
.login-card { width: min(440px, 100%); padding: 36px; border: 1px solid var(--admin-line); border-radius: 18px; background: linear-gradient(145deg, rgba(255,255,255,.025), transparent), #111517; box-shadow: 0 35px 90px rgba(0,0,0,.45); }
.login-logo { display: flex; align-items: center; gap: 11px; padding-bottom: 22px; border-bottom: 1px solid rgba(255,255,255,.07); }
.login-logo img { width: 58px; height: 58px; object-fit: contain; }
.login-logo img.farm-logo-image { width: 72px; height: 72px; border-radius: 18px; }
.login-logo strong, .login-logo span { display: block; }
.login-logo strong { color: var(--admin-gold-light); font-size: 16px; }
.login-logo span { color: #898f91; font-size: 11px; }
.login-heading { margin: 27px 0 22px; }
.login-heading > span { color: var(--admin-red-light); font-size: 9px; font-weight: 900; letter-spacing: 1.6px; }
.login-heading h2 { margin: 5px 0; font-size: 28px; }
.login-heading p { margin: 0; color: var(--admin-muted); font-size: 12px; }
.login-card .form-field { margin-bottom: 16px; }
.input-icon { display: flex; align-items: center; min-height: 47px; padding: 0 12px; border: 1px solid rgba(255,255,255,.11); border-radius: 9px; background: #090c0d; }
.input-icon:focus-within { border-color: rgba(218,166,63,.7); box-shadow: 0 0 0 3px rgba(218,166,63,.08); }
.input-icon b { color: var(--admin-gold); font-size: 10px; }
.input-icon input { border: 0; background: transparent; box-shadow: none; }
.input-icon button { border: 0; color: #8c9495; background: transparent; cursor: pointer; font-size: 10px; }
.back-site { display: block; margin-top: 18px; color: #838a8c; text-align: center; font-size: 11px; }
.back-site:hover { color: var(--admin-gold); }

/* Public verification */
.public-verify-body { min-height: 100vh; background: radial-gradient(circle at 50% -10%, rgba(218,166,63,.16), transparent 32rem), #07090a; }
.public-verify-shell { width: min(880px, calc(100% - 30px)); margin: 0 auto; padding: 24px 0; }
.public-verify-shell > header { padding: 10px 0 30px; }
.public-verify-shell > header a { display: inline-flex; align-items: center; gap: 11px; }
.public-verify-shell > header img { width: 55px; height: 55px; object-fit: contain; }
.public-verify-shell > header img.farm-logo-image { width: 68px; height: 68px; }
.public-verify-shell > header strong, .public-verify-shell > header span { display: block; }
.public-verify-shell > header strong { color: var(--admin-gold-light); }
.public-verify-shell > header span { color: var(--admin-muted); font-size: 10px; }
.public-verify-card { padding: clamp(25px, 5vw, 52px); border: 1px solid var(--admin-line-strong); border-radius: 20px; background: radial-gradient(circle at 50% 0, rgba(218,166,63,.1), transparent 22rem), var(--admin-panel); box-shadow: 0 35px 90px rgba(0,0,0,.45); }
.verify-title { text-align: center; }
.verify-title h1 { margin: 8px 0 5px; font-size: clamp(28px,5vw,44px); }
.verify-title p { margin: 0; color: var(--admin-muted); font-size: 12px; }
.verify-title .verification-icon { margin-bottom: 16px; }
.public-search { display: grid; grid-template-columns: 1fr auto; gap: 8px; max-width: 650px; margin: 28px auto; padding: 7px; border: 1px solid rgba(255,255,255,.1); border-radius: 12px; background: #090c0d; }
.public-search input { border: 0; background: transparent; box-shadow: none; }
.public-search button { padding: 9px 22px; border: 1px solid #efca77; border-radius: 8px; color: #1d1308; font-weight: 800; background: linear-gradient(135deg, #f1ce7e, #b8751c); cursor: pointer; }
.public-result { display: grid; grid-template-columns: auto 1fr; gap: 18px; padding: 22px; border: 1px solid; border-radius: 13px; }
.public-result.valid { border-color: rgba(67,189,129,.42); background: rgba(67,189,129,.055); }
.public-result.invalid, .public-result.revoked { border-color: rgba(226,77,79,.38); background: rgba(158,22,25,.08); }
.public-result.invalid .result-mark, .public-result.revoked .result-mark { color: white; background: var(--admin-red); }
.public-result > div > span { color: var(--admin-green); font-size: 11px; font-weight: 800; }
.public-result.invalid > div > span, .public-result.revoked > div > span { color: #ed7476; }
.public-result h2 { margin: 4px 0 14px; color: var(--admin-gold-light); font: 700 25px Georgia, serif; }
.public-result p { color: var(--admin-muted); font-size: 12px; line-height: 1.6; }
.public-result dl { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin: 0; }
.public-result dl div { padding: 9px 11px; border-radius: 7px; background: rgba(0,0,0,.18); }
.public-result dt { color: var(--admin-muted); font-size: 9px; }
.public-result dd { margin: 4px 0 0; font-size: 11px; font-weight: 700; }
.public-certificate-images { display: grid; grid-template-columns: repeat(3, minmax(0, 220px)); justify-content: center; gap: 8px; margin-top: 15px; }
.public-certificate-images.image-count-1 { grid-template-columns: minmax(0, 320px); }
.public-certificate-images.image-count-2 { grid-template-columns: repeat(2, minmax(0, 260px)); }
.public-certificate-images button { position: relative; min-width: 0; padding: 0; overflow: hidden; border: 1px solid rgba(218,166,63,.26); border-radius: 9px; background: #090c0d; cursor: zoom-in; }
.public-certificate-images img { width: 100%; height: 165px; padding: 7px; object-fit: contain; background: #f7f1e6; }
.public-certificate-images span { position: absolute; left: 6px; bottom: 6px; padding: 4px 7px; border-radius: 10px; color: #fff1c8; background: rgba(9,7,5,.78); font-size: 8px; }
.verify-security { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 25px; color: #747c7d; }
.verify-security > span { color: var(--admin-gold); }
.verify-security p { margin: 0; font-size: 10px; line-height: 1.55; }
.verify-security strong { color: #9da4a5; }
.public-verify-shell > footer { padding-top: 20px; color: #5f6668; text-align: center; font-size: 10px; }

/* Printable certificate */
.print-body { min-height: 100vh; padding: 30px; color: #241a0f; background: #d7d2c7; }
.print-toolbar { display: flex; justify-content: center; gap: 8px; margin-bottom: 16px; }
.print-toolbar button { padding: 10px 16px; border: 0; border-radius: 7px; color: white; background: #191511; cursor: pointer; }
.print-certificate { width: min(100%, 1000px); min-height: 700px; margin: 0 auto; padding: 18px; font-family: "TH Sarabun New", "Noto Serif Thai", "Leelawadee UI", "Times New Roman", serif; background: #f8f3e8; box-shadow: 0 25px 60px rgba(0,0,0,.22); }
.print-border { position: relative; min-height: 660px; padding: 34px 46px 24px; border: 4px double #9b6c20; background: radial-gradient(circle at 50% 35%, rgba(207,161,69,.13), transparent 22rem); }
.print-border header { display: flex; align-items: center; justify-content: center; gap: 16px; padding-bottom: 18px; border-bottom: 1px solid #c9ab72; text-align: left; }
.print-border header img { width: 82px; height: 82px; object-fit: contain; }
.print-border header img.farm-logo-image { border-radius: 18px; box-shadow: 0 6px 15px rgba(62, 39, 9, .18); }
.print-border header span { color: #9b6c20; font: 700 10px Georgia, serif; letter-spacing: 1.3px; }
.print-border header h1 { margin: 2px 0; font-size: 27px; font-weight: 700; letter-spacing: .15px; }
.print-border header p { margin: 0; color: #746653; font-size: 12px; }
.print-title { padding: 27px 0 18px; text-align: center; }
.print-title span { color: #a47425; font: 700 10px Georgia, serif; letter-spacing: 2px; }
.print-title h2 { margin: 7px 0; color: #6e1d18; font-size: 34px; font-weight: 700; }
.print-title strong { font: 700 15px Georgia, serif; }
.print-intro { margin: 5px 0; color: #766b5c; text-align: center; font-size: 13px; }
.print-subject { width: 78%; margin: 8px auto 24px; padding-bottom: 7px; border-bottom: 1px solid #ae8b51; color: #7e5418; text-align: center; overflow-wrap: anywhere; font-size: 31px; font-weight: 700; line-height: 1.2; }
.print-details { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; margin: 0; border: 1px solid #d0b984; background: #d0b984; }
.print-details div { display: grid; grid-template-columns: 130px 1fr; padding: 10px 13px; background: rgba(255,255,255,.72); }
.print-details dt { color: #816b4e; font-size: 11px; }
.print-details dd { margin: 0; font-size: 12px; font-weight: 700; }
.print-image-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 250px)); justify-content: center; gap: 10px; margin-top: 14px; }
.print-image-grid.image-count-1 { grid-template-columns: minmax(0, 300px); }
.print-image-grid.image-count-2 { grid-template-columns: repeat(2, minmax(0, 280px)); }
.print-image-grid figure { display: grid; grid-template-rows: 125px auto; min-width: 0; padding: 7px; margin: 0; border: 1px solid #d0b984; background: rgba(255,255,255,.52); }
.print-image-frame { position: relative; display: grid; place-items: center; width: 100%; height: 125px; overflow: hidden; background: #f8f4ea; }
.print-image-grid img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.print-image-grid figcaption { min-width: 0; padding: 6px 3px 2px; text-align: center; }
.print-image-grid b, .print-image-grid span { display: block; }
.print-image-grid b { color: #8b621f; font-size: 11px; }
.print-image-grid span { margin-top: 3px; overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.print-notes { padding: 9px; color: #766653; font-size: 10px; text-align: center; }
.print-border footer { display: flex; align-items: end; justify-content: space-between; padding: 22px 30px 0; }
.print-seal { display: grid; place-items: center; width: 92px; aspect-ratio: 1; border: 3px double #a47728; border-radius: 50%; color: #885f1d; text-align: center; }
.print-seal span { font-size: 20px; }
.print-seal strong { font: 700 8px Georgia, serif; }
.print-signature { display: grid; min-width: 220px; text-align: center; }
.print-signature > span { height: 35px; border-bottom: 1px solid #8d7b62; }
.print-signature > img { width: 190px; height: 58px; margin: 0 auto; object-fit: contain; border-bottom: 1px solid #8d7b62; }
.print-signature strong { margin-top: 6px; font-size: 11px; }
.print-signature small { color: #766b5c; font-size: 9px; }
.print-qr { display: grid; justify-items: center; gap: 2px; }
.print-qr img { width: 92px; height: 92px; padding: 3px; background: #fff; }
.print-qr span { color: #8b621f; font: 700 7px Georgia, serif; letter-spacing: .6px; }
.print-verification { margin-top: 18px; color: #7e7363; text-align: center; font: 8px Consolas, monospace; overflow-wrap: anywhere; }

.image-lightbox { position: fixed; z-index: 1000; inset: 0; display: grid; place-items: center; padding: 30px; opacity: 0; visibility: hidden; contain: layout paint style; background: rgba(0,0,0,.94); transition: opacity .16s ease, visibility .16s ease; }
.image-lightbox.is-open { opacity: 1; visibility: visible; }
.image-lightbox figure { position: relative; display: grid; justify-items: center; gap: 10px; max-width: min(1100px, 94vw); max-height: 90vh; margin: 0; }
.image-lightbox img { max-width: 100%; max-height: 82vh; border: 1px solid rgba(218,166,63,.45); border-radius: 10px; object-fit: contain; box-shadow: 0 28px 80px rgba(0,0,0,.5); transform: translateZ(0); }
.image-lightbox-loader { position: absolute; z-index: 2; top: 50%; left: 50%; width: 46px; height: 46px; margin: -23px 0 0 -23px; opacity: 0; pointer-events: none; border: 3px solid rgba(255,244,217,.25); border-top-color: #daa83f; border-radius: 50%; transition: opacity .12s ease; animation: image-lightbox-spin .7s linear infinite; }
.image-lightbox.is-loading .image-lightbox-loader { opacity: 1; }
.image-lightbox figcaption { color: #eee1c7; font-size: 12px; text-align: center; }
.image-lightbox-close { position: fixed; top: 18px; right: 20px; display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid rgba(255,255,255,.3); border-radius: 50%; color: white; background: rgba(15,15,15,.7); cursor: pointer; font-size: 25px; }
.image-lightbox-open { overflow: hidden; }
@keyframes image-lightbox-spin { to { rotate: 360deg; } }

@media (max-width: 1280px) {
    .stats-grid { grid-template-columns: repeat(2, 1fr); }
    .analytics-kpi-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .analytics-status-strip { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .breeder-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .achievement-admin-grid { grid-template-columns: 1fr; }
    .video-admin-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .role-admin-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .filter-bar { grid-template-columns: minmax(240px, 1fr) 180px 150px auto; }
    .filter-bar .btn-ghost { display: none; }
}

@media (max-width: 980px) {
    :root { --sidebar-width: 274px; }
    .admin-sidebar { transform: translateX(-102%); transition: transform .25s ease; }
    .admin-body.sidebar-open .admin-sidebar { transform: translateX(0); }
    .sidebar-backdrop { position: fixed; z-index: 35; inset: 0; width: 100%; height: 100%; border: 0; background: rgba(0,0,0,.62); backdrop-filter: blur(3px); }
    .admin-body.sidebar-open .sidebar-backdrop { display: block; }
    .admin-main { margin-left: 0; }
    .sidebar-toggle { display: grid; place-items: center; }
    .sidebar-collapse-toggle { display: none; }
    .dashboard-grid, .settings-grid, .account-security-grid, .analytics-overview-grid, .analytics-detail-grid { grid-template-columns: 1fr; }
    .summary-panel { min-height: auto; }
    .certificate-detail-grid { grid-template-columns: 1fr; }
    .certificate-image-upload-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .detail-side { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .login-shell { grid-template-columns: 1fr; }
    .login-showcase { display: none; }
    .login-panel { min-height: 100vh; }
}

@media (max-width: 760px) {
    .existing-gallery, .gallery-upload-preview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
    .admin-topbar { min-height: 72px; padding: 10px 15px; }
    .admin-tool-button { width: 40px; min-height: 40px; padding: 7px; }
    .admin-tool-button > b { display: none; }
    .admin-profile > div:last-child { display: none; }
    .admin-content { padding: 18px 14px 30px; }
    .dashboard-hero { min-height: 138px; padding: 21px; }
    .dashboard-hero img { width: 90px; margin-right: 0; opacity: .8; }
    .dashboard-hero p { max-width: 72%; }
    .stats-grid { grid-template-columns: 1fr; gap: 9px; }
    .stat-card { min-height: 98px; }
    .quick-grid { grid-template-columns: repeat(2, 1fr); }
    .chart-wrap { height: 250px; }
    .page-actions { align-items: stretch; flex-direction: column; }
    .analytics-action-group { align-items: stretch; flex-direction: column; }
    .analytics-action-group .btn { width: 100%; }
    .analytics-status-strip { grid-template-columns: 1fr; }
    .analytics-status-strip > div { min-height: 62px; }
    .analytics-setup { grid-template-columns: 1fr; justify-items: center; padding: 28px 20px; text-align: center; }
    .analytics-setup-icon { width: 105px; border-radius: 28px; font-size: 32px; }
    .analytics-setup li { text-align: left; }
    .analytics-filter { align-items: stretch; flex-direction: column; }
    .analytics-filter select, .analytics-filter .btn { width: 100%; }
    .analytics-filter p { align-self: auto; margin: 3px 0 0; text-align: center; }
    .analytics-kpi-grid, .analytics-secondary-stats { grid-template-columns: 1fr; }
    .analytics-kpi { min-height: 96px; }
    .analytics-secondary-stats > div { align-items: flex-start; flex-direction: column; gap: 4px; }
    .page-actions > .btn, .page-actions > .button-group { align-self: stretch; }
    .button-group .btn { flex: 1; }
    .filter-bar { grid-template-columns: 1fr 1fr; }
    .keyword-filter { grid-template-columns: 1fr 1fr; }
    .keyword-filter .search-field { grid-column: 1 / -1; }
    .keyword-filter .btn { width: 100%; }
    .filter-bar .search-field { grid-column: 1 / -1; }
    .filter-bar .btn { width: 100%; }
    .form-grid.two, .certificate-types, .certificate-source-modes, .certificate-profile-source, .certificate-parent-grid, .certificate-image-upload-grid, .popup-media-editor-grid, .popup-video-editor { grid-template-columns: 1fr; }
    .certificate-types label > span { min-height: 105px; }
    .certificate-profile-source { align-items: stretch; }
    .certificate-manual-note { align-items: flex-start; flex-direction: column; }
    .detail-side { grid-template-columns: 1fr; }
    .certificate-preview-head { grid-template-columns: auto 1fr; }
    .certificate-preview-head > .status { grid-column: 1 / -1; justify-self: start; }
    .detail-list { grid-template-columns: 1fr; }
    .verify-result, .verify-result.invalid { grid-template-columns: 1fr; text-align: center; }
    .verify-result .result-mark { margin: 0 auto; }
    .verify-result dl { grid-template-columns: 1fr 1fr; text-align: left; }
    .breeder-grid { grid-template-columns: 1fr; }
    .achievement-admin-card { grid-template-columns: 1fr; }
    .achievement-admin-image { min-height: 300px; }
    .achievement-stat-editor { grid-template-columns: 1fr; }
    .video-admin-grid { grid-template-columns: 1fr; }
    .management-stats, .role-admin-grid, .permission-groups { grid-template-columns: 1fr; }
    .management-stats article { padding: 15px; }
    .permission-heading { align-items: flex-start; flex-direction: column; }
    .image-upload-layout { grid-template-columns: 1fr; }
    .image-preview { width: min(100%, 240px); justify-self: center; }
    .login-panel { padding: 15px; }
    .login-card { padding: 25px 20px; }
    .public-verify-card { border-radius: 14px; }
    .public-search { grid-template-columns: 1fr; background: transparent; border: 0; padding: 0; }
    .public-search input { border: 1px solid rgba(255,255,255,.11); background: #090c0d; }
    .public-result { grid-template-columns: 1fr; text-align: center; }
    .public-result .result-mark { margin: 0 auto; }
    .public-result dl { grid-template-columns: 1fr; text-align: left; }
    .public-certificate-images, .public-certificate-images[class*="image-count-"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .print-body { padding: 0; }
    .print-certificate { padding: 8px; }
    .print-border { padding: 20px 16px; }
    .print-details { grid-template-columns: 1fr; }
    .print-image-grid, .print-image-grid[class*="image-count-"] { grid-template-columns: 1fr; }
}

/* Breeding reservation admin */
.breeding-admin-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.breeding-breeder-picker { position: relative; }
.breeding-breeder-picker.is-ready > select { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; opacity: 0; pointer-events: none; }
.breeding-breeder-trigger { display: grid; grid-template-columns: 68px minmax(0, 1fr) 30px; align-items: center; gap: 13px; width: 100%; min-height: 86px; padding: 9px 13px 9px 9px; border: 1px solid var(--admin-line); border-radius: 11px; color: var(--admin-text); text-align: left; background: #070a0b; cursor: pointer; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.breeding-breeder-trigger:hover, .breeding-breeder-picker.is-open .breeding-breeder-trigger { border-color: var(--admin-gold); box-shadow: 0 0 0 3px rgba(218,166,63,.09); }
.breeding-breeder-trigger:focus-visible { outline: 2px solid var(--admin-gold-light); outline-offset: 2px; }
.breeding-breeder-trigger-photo, .breeding-breeder-option-photo { display: grid; place-items: center; overflow: hidden; border: 1px solid rgba(218,166,63,.25); border-radius: 9px; color: var(--admin-gold-light); background: #14191b; }
.breeding-breeder-trigger-photo { width: 68px; height: 68px; font-size: 24px; }
.breeding-breeder-trigger-photo img, .breeding-breeder-option-photo img { width: 100%; height: 100%; object-fit: cover; }
.breeding-breeder-trigger-copy { min-width: 0; }
.breeding-breeder-trigger-copy small, .breeding-breeder-trigger-copy strong, .breeding-breeder-trigger-copy em { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.breeding-breeder-trigger-copy small { color: var(--admin-gold); font-size: 9px; }
.breeding-breeder-trigger-copy strong { margin-top: 3px; color: #f1f2ef; font-size: 13px; }
.breeding-breeder-trigger-copy em { margin-top: 5px; color: var(--admin-muted); font-size: 10px; font-style: normal; }
.breeding-breeder-trigger > b { color: var(--admin-gold); font-size: 20px; text-align: center; transition: transform .2s ease; }
.breeding-breeder-picker.is-open .breeding-breeder-trigger > b { transform: rotate(180deg); }
.breeding-breeder-options { position: absolute; z-index: 40; top: calc(100% - 18px); right: 0; left: 0; max-height: 350px; padding: 7px; overflow-y: auto; border: 1px solid rgba(218,166,63,.42); border-radius: 12px; background: rgba(7,10,11,.98); box-shadow: 0 22px 55px rgba(0,0,0,.48); backdrop-filter: blur(16px); }
.breeding-breeder-options[hidden] { display: none; }
.breeding-breeder-options [role="option"] { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; align-items: center; gap: 12px; width: 100%; padding: 8px; border: 1px solid transparent; border-radius: 9px; color: var(--admin-text); text-align: left; background: transparent; cursor: pointer; }
.breeding-breeder-options [role="option"] + [role="option"] { margin-top: 4px; }
.breeding-breeder-options [role="option"]:hover, .breeding-breeder-options [role="option"]:focus-visible { border-color: rgba(218,166,63,.35); outline: none; background: rgba(218,166,63,.08); }
.breeding-breeder-options [role="option"][aria-selected="true"] { border-color: var(--admin-gold); background: linear-gradient(135deg, rgba(218,166,63,.16), rgba(218,166,63,.04)); }
.breeding-breeder-option-photo { width: 56px; height: 56px; }
.breeding-breeder-options [role="option"] small, .breeding-breeder-options [role="option"] strong, .breeding-breeder-options [role="option"] em { display: block; }
.breeding-breeder-options [role="option"] small { color: var(--admin-gold); font-size: 9px; }
.breeding-breeder-options [role="option"] strong { margin-top: 2px; color: #f0f2ef; font-size: 12px; }
.breeding-breeder-options [role="option"] em { margin-top: 4px; color: var(--admin-muted); font-size: 9px; font-style: normal; }
.breeding-breeder-options [role="option"] > i { padding: 4px 7px; border-radius: 999px; color: #ffb5af; background: rgba(200,61,49,.15); font-size: 8px; font-style: normal; white-space: nowrap; }
.breeding-breeder-help { color: var(--admin-muted); }
.breeding-breeder-picker.has-error .breeding-breeder-trigger { border-color: #d9574c; box-shadow: 0 0 0 3px rgba(217,87,76,.1); }
.breeding-breeder-picker.has-error .breeding-breeder-help { color: #ffaaa2; }
.breeding-breeder-selection-error { margin-top: -4px; color: var(--admin-muted); }
.breeding-breeder-selection-error.has-error { color: #ffaaa2; font-weight: 700; }
@media (max-width: 620px) {
    .breeding-breeder-trigger { grid-template-columns: 58px minmax(0, 1fr) 22px; min-height: 76px; gap: 10px; padding: 8px 10px 8px 8px; }
    .breeding-breeder-trigger-photo { width: 58px; height: 58px; }
    .breeding-breeder-options { max-height: 310px; }
    .breeding-breeder-options [role="option"] { grid-template-columns: 50px minmax(0, 1fr); }
    .breeding-breeder-option-photo { width: 50px; height: 50px; }
    .breeding-breeder-options [role="option"] > i { grid-column: 2; justify-self: start; }
}

/* Breed certificate editor and dual branded QR */
.certificate-remove-image { margin-top: 12px; border-color: rgba(226,77,79,.28); background: rgba(115,20,23,.08); }
.certificate-remove-image strong { color: #ffc1ba; }
.certificate-remove-image small { display: block; margin-top: 3px; color: var(--admin-muted); font-size: 9px; }
.certificate-qr-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 14px 0; }
.certificate-branded-qr { display: grid; justify-items: center; gap: 7px; min-width: 0; }
.certificate-branded-qr > b { color: var(--admin-gold-light); font-size: 9px; }
.certificate-qr-canvas { position: relative; width: min(145px, 100%); aspect-ratio: 1; padding: 6px; border: 1px solid rgba(218,166,63,.32); border-radius: 12px; background: #fff; }
.certificate-qr-canvas.line { border-color: rgba(6,199,85,.58); }
.certificate-qr-canvas > img { width: 100%; height: 100%; object-fit: contain; }
.certificate-qr-canvas > span { position: absolute; top: 50%; left: 50%; display: grid; place-items: center; width: 23%; aspect-ratio: 1; padding: 3px; overflow: hidden; border: 3px solid #fff; border-radius: 8px; background: #fff; box-shadow: 0 2px 7px rgba(0,0,0,.18); transform: translate(-50%,-50%); }
.certificate-qr-canvas > span img { width: 100%; height: 100%; border-radius: 4px; object-fit: cover; }

/* A4 landscape breed certificate */
.breed-print-body { min-width: 1123px; padding: 24px; overflow: auto; color: #0e2446; background: #d8d3c9; }
.breed-certificate-sheet { box-sizing: border-box; width: 297mm; height: 210mm; margin: 0 auto; padding: 4.5mm; overflow: hidden; font-family: Tahoma, "Noto Sans Thai", "Leelawadee UI", Arial, sans-serif; background: linear-gradient(135deg,#fffdf8,#f8efe2 58%,#fffaf1); box-shadow: 0 24px 70px rgba(36,27,17,.28); print-color-adjust: exact; -webkit-print-color-adjust: exact; }
.breed-certificate-border { position: relative; box-sizing: border-box; width: 100%; height: 100%; padding: 8mm 9mm 7mm; border: .7mm solid #b8872d; outline: .22mm solid #d6b05c; outline-offset: -2.1mm; background: radial-gradient(circle at 72% 31%,rgba(218,172,76,.11),transparent 32%),linear-gradient(90deg,rgba(255,255,255,.76),rgba(255,250,240,.5)); }
.breed-certificate-border::before,.breed-certificate-border::after { content: ""; position: absolute; z-index: 0; right: 12mm; left: 12mm; height: .45mm; background: linear-gradient(90deg,transparent,#b8872d 12%,#e7c97c 50%,#b8872d 88%,transparent); }
.breed-certificate-border::before { top: 4.8mm; }
.breed-certificate-border::after { bottom: 4.8mm; }
.breed-corner { position: absolute; z-index: 2; color: #b8872d; font-family: Georgia,serif; font-size: 15mm; font-style: normal; line-height: 1; }
.breed-corner.top-left { top: 1mm; left: 1mm; transform: rotate(-45deg); }
.breed-corner.top-right { top: 1mm; right: 1mm; transform: rotate(45deg) scaleX(-1); }
.breed-corner.bottom-left { bottom: 1mm; left: 1mm; transform: rotate(-135deg) scaleX(-1); }
.breed-corner.bottom-right { right: 1mm; bottom: 1mm; transform: rotate(135deg); }
.breed-certificate-layout { position: relative; z-index: 1; display: grid; grid-template-columns: 103mm minmax(0,1fr); gap: 8mm; height: 100%; }
.breed-certificate-visual { display: grid; grid-template-rows: minmax(0,1fr) 38mm; gap: 4mm; min-width: 0; }
.breed-certificate-photo { display: grid; grid-template-rows: minmax(0,1fr) auto; min-height: 0; margin: 0; padding: 3mm; border: .45mm solid #b8872d; border-radius: 8mm 8mm 3mm 3mm; background: rgba(255,255,255,.82); box-shadow: inset 0 0 0 .7mm #f3dfab,0 2mm 7mm rgba(85,56,17,.13); }
.breed-certificate-photo-inner { position: relative; display: grid; place-items: center; min-height: 0; overflow: hidden; border: .25mm solid #d2ad63; border-radius: 5mm 5mm 1.8mm 1.8mm; background: radial-gradient(circle at 50% 10%,#fffdf5,#eee3d0); }
.breed-certificate-photo-inner > img { width: 100%; height: 100%; object-fit: contain; }
.breed-certificate-photo-empty { display: grid; justify-items: center; gap: 3mm; color: #9b722f; }
.breed-certificate-photo-empty img { width: 39mm; height: 39mm; padding: 1.5mm; border-radius: 6mm; object-fit: contain; background: #050505; }
.breed-certificate-photo-empty span { font-size: 4mm; font-weight: 700; }
.breed-certificate-photo figcaption { display: grid; grid-template-columns: auto 1fr; align-items: baseline; gap: 1mm 3mm; padding: 2.5mm 1.5mm 0; text-align: center; }
.breed-certificate-photo figcaption span { color: #9a712e; font-size: 3mm; }
.breed-certificate-photo figcaption strong { color: #8c1e16; font: 800 6.2mm Georgia,"Noto Serif Thai",serif; text-align: left; }
.breed-certificate-photo figcaption small { grid-column: 1/-1; overflow: hidden; color: #675948; font-size: 2.8mm; text-overflow: ellipsis; white-space: nowrap; }
.breed-certificate-qr-row { display: grid; grid-template-columns: repeat(2,1fr); align-items: start; justify-items: center; gap: 4mm; }
.breed-certificate-qr-row.single { grid-template-columns: 1fr; }
.breed-branded-qr { display: grid; justify-items: center; gap: .7mm; color: #10254a; }
.breed-qr-canvas { position: relative; box-sizing: border-box; width: 28mm; height: 28mm; padding: 1mm; border: .45mm solid #0f294f; border-radius: 2mm; background: #fff; }
.line-qr .breed-qr-canvas { border-color: #06a848; }
.breed-qr-canvas > img { display: block; width: 100%; height: 100%; object-fit: contain; }
.breed-qr-canvas > span { position: absolute; top: 50%; left: 50%; display: grid; place-items: center; box-sizing: border-box; width: 7mm; height: 7mm; padding: .6mm; overflow: hidden; border: .8mm solid #fff; border-radius: 1.5mm; background: #fff; box-shadow: 0 .4mm 1.5mm rgba(0,0,0,.2); transform: translate(-50%,-50%); }
.breed-qr-canvas > span img { width: 100%; height: 100%; border-radius: .8mm; object-fit: cover; }
.breed-branded-qr b { padding: .7mm 2.8mm; border-radius: 3mm; color: #fff; font-size: 2.7mm; background: #10254a; }
.line-qr b { background: #069d45; }
.breed-branded-qr small { max-width: 42mm; overflow: hidden; color: #72634d; font-size: 2.1mm; text-overflow: ellipsis; white-space: nowrap; }
.breed-certificate-content { display: flex; min-width: 0; flex-direction: column; align-items: stretch; text-align: center; }
.breed-certificate-brand { position: relative; display: grid; justify-items: center; height: 41mm; }
.breed-certificate-brand > img { width: 37mm; height: 33mm; margin-top: 1mm; padding: 1mm; border-radius: 4mm; object-fit: contain; background: #050505; box-shadow: 0 1.4mm 4mm rgba(40,26,8,.16); }
.breed-certificate-brand > p { margin: 1mm 0 0; color: #a6782a; font: 700 2.2mm Georgia,serif; letter-spacing: .35mm; }
.breed-certificate-stars { position: absolute; top: -1mm; left: 50%; display: flex; align-items: end; justify-content: space-between; width: 55mm; color: #c29132; transform: translateX(-50%); }
.breed-certificate-stars span { font-size: 5mm; text-shadow: 0 .5mm .6mm rgba(88,52,3,.22); }
.breed-certificate-stars span:nth-child(2),.breed-certificate-stars span:nth-child(4) { margin-bottom: 6mm; font-size: 6mm; }
.breed-certificate-stars span:nth-child(3) { margin-bottom: 10mm; font-size: 8mm; }
.breed-certificate-ribbon { position: relative; display: grid; place-items: center; width: 98mm; height: 15mm; margin: 1mm auto 0; color: #10254a; filter: drop-shadow(0 1mm 1mm rgba(72,45,8,.18)); }
.breed-certificate-ribbon::before { content: ""; position: absolute; z-index: -1; inset: 0 6mm; border-radius: 2mm; background: linear-gradient(90deg,#b8791f,#f4d88b 19%,#c58c2d 50%,#f0cf74 82%,#a86817); clip-path: polygon(0 12%,100% 12%,96% 50%,100% 88%,0 88%,4% 50%); }
.breed-certificate-ribbon span { font-size: 7.3mm; font-weight: 800; text-shadow: 0 .3mm #fff4cf; }
.breed-certificate-content h1 { margin: 1.5mm 0 0; overflow: hidden; color: #10254a; font-size: 10.1mm; font-weight: 900; line-height: 1.1; letter-spacing: -.45mm; text-overflow: ellipsis; white-space: nowrap; }
.breed-certificate-number { margin-top: 1.5mm; color: #8e6a31; font-size: 2.8mm; }
.breed-certificate-number strong { margin-left: 2mm; color: #10254a; font-family: Georgia,serif; letter-spacing: .35mm; }
.breed-certificate-divider { display: flex; align-items: center; gap: 2mm; margin: 1.5mm 20mm 2mm; color: #b8872d; }
.breed-certificate-divider::before,.breed-certificate-divider::after { content: ""; height: .3mm; flex: 1; background: linear-gradient(90deg,transparent,#b8872d,transparent); }
.breed-certificate-fields { display: grid; gap: 1.6mm; margin: 0; color: #10254a; text-align: left; }
.breed-certificate-fields > div,.breed-certificate-fields section { min-width: 0; }
.breed-certificate-fields > div:not(.split):not(.identity),.breed-certificate-fields .split section,.breed-certificate-fields .identity section { display: grid; grid-template-columns: 28mm minmax(0,1fr); align-items: end; gap: 2mm; }
.breed-certificate-fields .split { display: grid; grid-template-columns: .9fr 1.3fr; gap: 6mm; }
.breed-certificate-fields .split.secondary { grid-template-columns: 1fr 1fr; }
.breed-certificate-fields .identity { display: grid; grid-template-columns: 1fr .9fr 1fr; gap: 4mm; }
.breed-certificate-fields .identity section { grid-template-columns: auto minmax(0,1fr); }
.breed-certificate-fields dt { color: #10254a; font-size: 3.3mm; font-weight: 800; white-space: nowrap; }
.breed-certificate-fields dd { min-width: 0; min-height: 5.8mm; margin: 0; padding: 0 1.4mm .8mm; overflow: hidden; border-bottom: .28mm solid #9c8b70; color: #162d52; font-size: 3.25mm; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.breed-certificate-fields .breed-sex { grid-template-columns: auto 1fr; }
.breed-certificate-fields .breed-sex dd { display: flex; align-items: center; gap: 1.4mm; }
.sex-box { display: inline-grid; place-items: center; width: 4.7mm; height: 4.7mm; border: .4mm solid #17325c; color: transparent; font-size: 3.8mm; line-height: 1; }
.sex-box.checked { color: #17325c; }
.breed-certificate-declaration { margin-top: 4mm; color: #10254a; font-family: "Noto Serif Thai",Tahoma,serif; }
.breed-certificate-declaration p { margin: .8mm 0; font-size: 3.4mm; line-height: 1.45; }
.breed-certificate-declaration strong { display: block; margin: 1mm 0; color: #9b6a21; font-size: 4.7mm; }
.breed-certificate-footer { display: flex; align-items: end; justify-content: space-between; gap: 8mm; min-height: 12mm; margin-top: auto; padding-top: 2mm; border-top: .25mm solid rgba(184,135,45,.45); text-align: left; }
.breed-certificate-footer > div:first-child span,.breed-certificate-footer > div:first-child strong { display: block; }
.breed-certificate-footer > div:first-child span { color: #9b722f; font-size: 2.4mm; }
.breed-certificate-footer > div:first-child strong { margin-top: .6mm; color: #10254a; font-size: 3.1mm; }
.breed-certificate-signature { display: grid; justify-items: center; min-width: 45mm; text-align: center; }
.breed-certificate-signature img { width: 35mm; height: 8mm; object-fit: contain; }
.breed-certificate-signature strong { font-size: 2.7mm; }
.breed-certificate-signature small { color: #74654f; font-size: 2.1mm; }

@media print {
    @page { size: A4 landscape; margin: 0; }
    html,body.breed-print-body { width: 297mm; height: 210mm; margin: 0; padding: 0; overflow: hidden; background: #fff; }
    .breed-print-body .print-toolbar { display: none; }
    .breed-certificate-sheet { width: 297mm; height: 210mm; margin: 0; box-shadow: none; }
}

@media (max-width: 720px) {
    .certificate-qr-pair { grid-template-columns: 1fr; }
}
.breeding-admin-summary { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 10px; margin-bottom: 18px; }
.breeding-admin-summary article { min-height: 92px; padding: 16px; border: 1px solid var(--admin-line); border-radius: 13px; background: linear-gradient(145deg,rgba(218,166,63,.06),transparent),var(--admin-panel); }
.breeding-admin-summary span, .breeding-admin-summary strong { display: block; }
.breeding-admin-summary span { color: var(--admin-muted); font-size: 10px; }
.breeding-admin-summary strong { margin-top: 7px; color: var(--admin-gold-light); font: 800 29px Georgia,serif; }
.breeding-settings-panel { margin-bottom: 18px; padding: 0; overflow: hidden; }
.breeding-settings-panel summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 22px; cursor: pointer; list-style: none; }
.breeding-settings-panel summary::-webkit-details-marker { display: none; }
.breeding-settings-panel summary span, .breeding-settings-panel summary b, .breeding-settings-panel summary small { display: block; }
.breeding-settings-panel summary b { color: var(--admin-gold-light); }
.breeding-settings-panel summary small { margin-top: 3px; color: var(--admin-muted); font-size: 10px; }
.breeding-settings-panel summary i { color: var(--admin-gold); font-size: 10px; font-style: normal; }
.breeding-settings-panel[open] summary { border-bottom: 1px solid var(--admin-line); }
.breeding-period-admin { margin-bottom: 18px; padding: 22px; }
.breeding-period-admin-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.breeding-period-admin-grid > article { display: grid; grid-template-columns: 115px minmax(0,1fr); gap: 13px; padding: 12px; border: 1px solid rgba(255,255,255,.08); border-radius: 13px; background: #0c1011; }
.breeding-period-admin-grid > article > img { width: 115px; height: 100%; min-height: 170px; object-fit: cover; border-radius: 10px; background: #19130c; }
.breeding-period-admin-grid small { color: var(--admin-gold); font-size: 9px; }
.breeding-period-admin-grid h4 { margin: 3px 0; font-size: 15px; }
.breeding-period-admin-grid p { margin: 0 0 8px; color: #b3b7b7; font-size: 10px; }
.breeding-period-admin-grid dl { display: grid; gap: 4px; margin: 0; }
.breeding-period-admin-grid dl div { display: flex; justify-content: space-between; gap: 7px; }
.breeding-period-admin-grid dt { color: #767d7e; font-size: 8px; }
.breeding-period-admin-grid dd { margin: 0; color: #d4d0c7; font-size: 9px; text-align: right; }
.breeding-period-admin-buttons { display: flex; gap: 5px; margin-top: 9px; }
.breeding-period-admin-buttons form { margin: 0; }
.breeding-period-admin-buttons .btn { min-height: 32px; padding: 6px 10px; font-size: 9px; }
.breeding-admin-filter { display: grid; grid-template-columns: minmax(240px,1fr) 190px 160px auto auto; align-items: end; gap: 9px; margin-bottom: 12px; padding: 13px; }
.breeding-admin-filter > label:not(.search-field) { display: grid; gap: 5px; }
.breeding-admin-filter > label > span { color: var(--admin-muted); font-size: 9px; }
.breeding-admin-filter select, .breeding-admin-filter input[type="month"] { min-height: 42px; }
.breeding-view-switch { display: inline-flex; gap: 4px; margin-bottom: 12px; padding: 4px; border: 1px solid var(--admin-line); border-radius: 10px; background: var(--admin-panel); }
.breeding-view-switch a { padding: 8px 16px; border-radius: 7px; color: var(--admin-muted); font-size: 10px; font-weight: 800; }
.breeding-view-switch a.active { color: #251707; background: linear-gradient(135deg,#f0cc78,#b8791d); }
.breeding-booking-list-heading { margin: 3px 1px 11px; }
.breeding-booking-list-heading small { color: var(--admin-muted); font-size: 9px; }
.breeding-booking-admin-list { display: grid; gap: 10px; }
.breeding-booking-admin-card { display: grid; grid-template-columns: 180px minmax(260px,1.05fr) minmax(220px,.8fr) minmax(180px,.65fr) auto; align-items: center; gap: 14px; padding: 14px; }
.breeding-booking-reference code, .breeding-booking-reference small { display: block; }
.breeding-booking-reference code { margin: 8px 0 4px; color: var(--admin-gold-light); font: 800 13px Consolas,monospace; }
.breeding-booking-reference small { color: var(--admin-muted); font-size: 8px; }
.breeding-booking-female { display: grid; grid-template-columns: 75px minmax(0,1fr); gap: 11px; align-items: center; }
.breeding-booking-female img { width: 75px; height: 78px; object-fit: cover; border: 1px solid rgba(218,166,63,.3); border-radius: 10px; }
.breeding-booking-female small, .breeding-booking-female strong, .breeding-booking-female span, .breeding-booking-female b { display: block; }
.breeding-booking-female small, .breeding-booking-customer small, .breeding-booking-payment small { color: var(--admin-muted); font-size: 8px; }
.breeding-booking-female strong { margin: 2px 0; }
.breeding-booking-female span { color: #9da3a3; font-size: 9px; }
.breeding-booking-female b { margin-top: 3px; color: var(--admin-gold-light); font: 800 13px Georgia,serif; }
.breeding-booking-customer strong, .breeding-booking-customer a, .breeding-booking-customer span, .breeding-booking-payment strong, .breeding-booking-payment span, .breeding-booking-payment a { display: block; }
.breeding-booking-customer strong, .breeding-booking-payment strong { margin: 3px 0; font-size: 12px; }
.breeding-booking-customer a, .breeding-booking-payment a { color: var(--admin-gold); font-size: 9px; }
.breeding-booking-customer span, .breeding-booking-payment span { color: #969d9e; font-size: 9px; }
.breeding-admin-calendar-panel { padding: 18px; }
.breeding-admin-calendar-panel .breeding-calendar-toolbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.breeding-admin-calendar-panel .breeding-calendar-toolbar a { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--admin-line-strong); border-radius: 50%; color: var(--admin-gold); }
.breeding-admin-calendar-panel .breeding-calendar-toolbar strong { color: var(--admin-gold-light); }
.admin-mode .breeding-calendar-grid { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 4px; }
.admin-mode .breeding-calendar-weekday { padding: 7px; color: var(--admin-muted); text-align: center; font-size: 9px; }
.admin-mode .breeding-calendar-day { min-height: 120px; padding: 6px; border: 1px solid rgba(255,255,255,.07); border-radius: 8px; background: #0b0e0f; }
.admin-mode .breeding-calendar-day.is-empty { opacity: .4; }
.admin-mode .breeding-calendar-day > span { display: grid; place-items: center; width: 25px; height: 25px; margin-bottom: 4px; border-radius: 50%; color: #8c9394; font-size: 9px; }
.admin-mode .breeding-calendar-day.is-today > span { color: #211506; background: var(--admin-gold); }
.admin-mode .breeding-calendar-event { display: block; margin-top: 4px; padding: 6px; overflow: hidden; border-radius: 6px; color: #f6eddb; background: #6f511b; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.admin-mode .breeding-calendar-event.status-confirmed, .admin-mode .breeding-calendar-event.status-completed { background: #176442; }
.admin-mode .breeding-calendar-event.status-cancelled, .admin-mode .breeding-calendar-event.status-rejected { opacity: .6; background: #5f3030; text-decoration: line-through; }
.breeding-admin-detail-grid { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(310px,.55fr); gap: 16px; }
.breeding-admin-detail { padding: 22px; }
.breeding-admin-detail h3 { margin: 22px 0 9px; color: var(--admin-gold-light); }
.breeding-admin-detail dl, .breeding-payment-review dl { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; margin: 0; }
.breeding-admin-detail dl div, .breeding-payment-review dl div { padding: 10px; border: 1px solid rgba(255,255,255,.07); border-radius: 8px; background: #0b0f10; }
.breeding-admin-detail dl div.full { grid-column: 1 / -1; }
.breeding-admin-detail dt, .breeding-payment-review dt { color: var(--admin-muted); font-size: 8px; }
.breeding-admin-detail dd, .breeding-payment-review dd { margin: 3px 0 0; overflow-wrap: anywhere; font-size: 10px; font-weight: 700; line-height: 1.6; }
.breeding-admin-detail a { color: var(--admin-gold); }
.breeding-admin-side { display: grid; align-content: start; gap: 12px; }
.breeding-payment-review { padding: 20px; }
.booking-modal-open { overflow: hidden; }
.booking-detail-modal[hidden] { display: none; }
.booking-detail-modal { position: fixed; z-index: 1200; inset: 0; display: grid; place-items: center; padding: clamp(12px, 2vw, 26px); opacity: 0; visibility: hidden; transition: opacity .18s ease, visibility .18s ease; }
.booking-detail-modal.is-open { opacity: 1; visibility: visible; }
.booking-detail-modal-backdrop { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; border-radius: 0; background: rgba(3, 5, 6, .82); backdrop-filter: blur(7px); cursor: default; }
.booking-detail-modal-dialog { position: relative; z-index: 1; display: grid; grid-template-rows: auto minmax(0, 1fr); width: min(1420px, 96vw); max-height: 94vh; overflow: hidden; border: 1px solid var(--admin-line-strong); border-radius: 20px; background: var(--admin-bg-soft); box-shadow: 0 32px 100px rgba(0, 0, 0, .55); transform: translateY(14px) scale(.985); transition: transform .18s ease; }
.booking-detail-modal.is-open .booking-detail-modal-dialog { transform: translateY(0) scale(1); }
.booking-detail-modal-dialog > header { display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 68px; padding: 13px 18px 13px 22px; border-bottom: 1px solid var(--admin-line); background: var(--admin-panel); }
.booking-detail-modal-dialog > header span, .booking-detail-modal-dialog > header strong { display: block; }
.booking-detail-modal-dialog > header span { color: var(--admin-muted); font-size: 9px; }
.booking-detail-modal-dialog > header strong { margin-top: 2px; color: var(--admin-gold-light); font-size: 15px; }
.booking-detail-modal-dialog > header button { display: grid; place-items: center; width: 42px; height: 42px; padding: 0; border: 1px solid var(--admin-line); border-radius: 50%; color: var(--admin-text); background: var(--admin-panel-2); cursor: pointer; font-size: 24px; line-height: 1; }
.booking-detail-modal-dialog > header button:hover { color: white; border-color: rgba(226,77,79,.55); background: var(--admin-red); }
.booking-detail-modal-content { min-height: 260px; padding: clamp(16px, 2.2vw, 28px); overflow: auto; overscroll-behavior: contain; }
.booking-modal-loading, .booking-modal-error { display: grid; place-items: center; align-content: center; gap: 14px; min-height: 360px; text-align: center; }
.booking-modal-loading > span { width: 48px; height: 48px; border: 3px solid var(--admin-line); border-top-color: var(--admin-gold); border-radius: 50%; animation: booking-modal-spin .75s linear infinite; }
.booking-modal-loading strong { color: var(--admin-muted); font-size: 12px; }
.booking-modal-error p { margin: 0; color: var(--admin-muted); }
@keyframes booking-modal-spin { to { transform: rotate(360deg); } }

.booking-modal-summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 16px; padding: 4px 2px; }
.booking-modal-summary h2 { margin: 5px 0 3px; color: var(--admin-gold-light); font-size: clamp(22px, 3vw, 31px); }
.booking-modal-summary p { margin: 0; color: var(--admin-muted); font-size: 10px; }
.booking-status-timeline { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); margin-bottom: 18px; padding: 18px; border: 1px solid var(--admin-line); border-radius: 15px; background: var(--admin-panel); }
.timeline-step { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; min-width: 0; padding-right: 12px; }
.timeline-step:not(:last-child)::after { content: ""; position: absolute; z-index: 0; top: 17px; left: 36px; right: 0; height: 2px; background: var(--admin-line); }
.timeline-step.is-completed:not(:last-child)::after { background: var(--admin-green); }
.timeline-marker { position: relative; z-index: 1; display: grid; place-items: center; width: 34px; height: 34px; border: 2px solid var(--admin-line-strong); border-radius: 50%; color: var(--admin-muted); background: var(--admin-panel-2); font-size: 10px; font-weight: 900; }
.timeline-step.is-completed .timeline-marker { color: white; border-color: var(--admin-green); background: #28845b; }
.timeline-step.is-current .timeline-marker { color: #271803; border-color: #f1c565; background: linear-gradient(135deg, #f3d180, #bd781d); box-shadow: 0 0 0 5px rgba(218,166,63,.12); }
.timeline-step.is-terminal .timeline-marker { color: white; border-color: var(--admin-red-light); background: var(--admin-red); box-shadow: 0 0 0 5px rgba(158,22,25,.12); }
.timeline-step.is-skipped { opacity: .42; }
.timeline-copy { min-width: 0; }
.timeline-copy small, .timeline-copy strong, .timeline-copy time { display: block; }
.timeline-copy small { color: var(--admin-muted); font-size: 8px; }
.timeline-copy strong { margin-top: 3px; color: var(--admin-text); font-size: 11px; }
.timeline-step.is-current .timeline-copy strong { color: var(--admin-gold-light); }
.timeline-copy p { margin: 3px 0 0; color: var(--admin-muted); font-size: 8px; line-height: 1.5; }
.timeline-copy time { margin-top: 4px; color: var(--admin-gold); font-size: 8px; }
.booking-detail-modal .breeding-admin-detail-grid { align-items: start; }
.booking-detail-modal .breeding-admin-side { position: sticky; top: 0; }

[data-theme="light"] body,
[data-theme="light"] .admin-body { background: radial-gradient(circle at 82% 0%, rgba(189,130,38,.11), transparent 31rem), linear-gradient(135deg, #f7f4ed, #eee9df); }
[data-theme="light"] .admin-sidebar { background: linear-gradient(180deg, rgba(183,121,25,.06), transparent 25%), #fffaf1; box-shadow: 14px 0 35px rgba(77,55,22,.08); }
[data-theme="light"] .sidebar-brand span { color: #5f5b54; }
[data-theme="light"] .sidebar-nav a { color: #52595a; }
[data-theme="light"] .sidebar-nav a:hover { color: #282b2c; background: rgba(177,112,18,.08); }
[data-theme="light"] .sidebar-heading { color: #8b8378; }
[data-theme="light"] .sidebar-logout button { color: #555b5c; background: rgba(111,82,38,.03); }
[data-theme="light"] .admin-topbar { background: rgba(255,252,246,.9); box-shadow: 0 5px 24px rgba(76,54,22,.04); }
[data-theme="light"] .topbar-title span { color: #7b7469; }
[data-theme="light"] .panel,
[data-theme="light"] .panel-gold-edge,
[data-theme="light"] .stat-card,
[data-theme="light"] .breeding-admin-summary article { background: linear-gradient(145deg, rgba(172,109,19,.025), transparent 50%), var(--admin-panel); }
[data-theme="light"] .form-field > span { color: #4a5051; }
[data-theme="light"] input,
[data-theme="light"] select,
[data-theme="light"] textarea,
[data-theme="light"] .search-field { color: var(--admin-text); border-color: rgba(118,82,31,.2); background: #fffefa; }
[data-theme="light"] .search-field input { color: var(--admin-text); }
[data-theme="light"] select { color-scheme: light; }
[data-theme="light"] input::placeholder,
[data-theme="light"] textarea::placeholder { color: #97948e; }
[data-theme="light"] .breeding-period-admin-grid > article,
[data-theme="light"] .admin-mode .breeding-calendar-day,
[data-theme="light"] .breeding-admin-detail dl div,
[data-theme="light"] .breeding-payment-review dl div { border-color: rgba(118,82,31,.14); background: #fbf8f1; }
[data-theme="light"] .breeding-period-admin-grid p,
[data-theme="light"] .breeding-period-admin-grid dd,
[data-theme="light"] .breeding-booking-female span,
[data-theme="light"] .breeding-booking-customer span,
[data-theme="light"] .breeding-booking-payment span { color: #62696a; }
[data-theme="light"] .booking-detail-modal-backdrop { background: rgba(48,40,29,.58); }
[data-theme="light"] .booking-detail-modal-dialog { box-shadow: 0 30px 90px rgba(51,38,18,.28); }

@media (max-width: 1280px) {
    .breeding-admin-summary { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .breeding-period-admin-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .breeding-booking-admin-card { grid-template-columns: 160px 1fr 1fr; }
    .breeding-booking-admin-card > .breeding-booking-payment { grid-column: 2; }
}
@media (max-width: 900px) {
    .breeding-period-admin-grid { grid-template-columns: 1fr; }
    .breeding-admin-filter { grid-template-columns: 1fr 1fr; }
    .breeding-admin-filter .search-field { grid-column: 1 / -1; }
    .breeding-admin-detail-grid { grid-template-columns: 1fr; }
    .breeding-booking-admin-card { grid-template-columns: 1fr 1fr; }
    .breeding-booking-reference { grid-column: 1 / -1; }
    .breeding-booking-admin-card > .breeding-booking-payment { grid-column: auto; }
    .breeding-admin-calendar-panel { overflow-x: auto; }
    .admin-mode .breeding-calendar-grid { min-width: 850px; }
    .booking-status-timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 0; }
    .timeline-step:nth-child(2n)::after { display: none; }
    .booking-detail-modal .breeding-admin-side { position: static; }
}
@media (max-width: 620px) {
    .breeding-admin-actions, .breeding-admin-actions .btn { width: 100%; }
    .breeding-admin-summary { grid-template-columns: 1fr 1fr; }
    .breeding-period-admin-grid > article { grid-template-columns: 92px minmax(0,1fr); }
    .breeding-period-admin-grid > article > img { width: 92px; }
    .breeding-admin-filter, .breeding-booking-admin-card, .breeding-admin-detail dl, .breeding-payment-review dl { grid-template-columns: 1fr; }
    .breeding-admin-filter .search-field, .breeding-booking-reference, .breeding-admin-detail dl div.full { grid-column: auto; }
    .breeding-booking-female { grid-template-columns: 68px minmax(0,1fr); }
    .booking-detail-modal { padding: 0; }
    .booking-detail-modal-dialog { width: 100%; max-height: 100vh; min-height: 100vh; border: 0; border-radius: 0; }
    .booking-detail-modal-dialog > header { min-height: 62px; padding: 10px 12px 10px 16px; }
    .booking-detail-modal-content { padding: 14px 11px 24px; }
    .booking-modal-summary { align-items: flex-start; flex-direction: column; gap: 9px; }
    .booking-status-timeline { grid-template-columns: 1fr; gap: 0; padding: 14px; }
    .timeline-step { min-height: 94px; padding: 0 0 14px; }
    .timeline-step:not(:last-child)::after { display: block; top: 34px; bottom: 0; left: 16px; width: 2px; height: auto; }
    .timeline-copy p { font-size: 9px; }
}

@media (max-width: 1100px) {
    .homepage-popup-admin-grid { grid-template-columns: 1fr; }
    .homepage-popup-preview-panel { position: static; }
}

@media print {
    @page { size: A4 landscape; margin: 8mm; }
    .print-body { padding: 0; background: white; }
    .print-toolbar { display: none; }
    .print-certificate { width: 100%; min-height: auto; padding: 0; box-shadow: none; }
    .print-border { min-height: 180mm; }
}

.sale-admin-filter { display: grid; grid-template-columns: minmax(260px, 1fr) 180px auto auto; gap: 9px; padding: 14px; margin-bottom: 16px; }
.sale-admin-filter select { min-height: 42px; }
.sale-admin-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.sale-admin-card { overflow: hidden; }
.sale-admin-image { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: #080a0b; }
.sale-admin-image > img { width: 100%; height: 100%; object-fit: cover; }
.sale-admin-image .status { position: absolute; z-index: 2; top: 13px; right: 13px; background: rgba(8,10,11,.9); }
.sale-promo-badge { position: absolute; z-index: 2; left: 12px; bottom: 12px; padding: 6px 9px; border-radius: 20px; color: #fff3d5; background: #9e1619; font-size: 9px; font-weight: 900; letter-spacing: .7px; }
.sale-admin-body { padding: 17px; }
.sale-admin-body h3 { margin: 4px 0 2px; font-size: 19px; }
.sale-admin-body > p { min-height: 38px; margin: 0; color: var(--admin-muted); font-size: 11px; }
.sale-admin-price { display: flex; align-items: baseline; gap: 8px; margin: 13px 0; color: var(--admin-gold-light); }
.sale-admin-price strong { font: 800 24px Georgia, serif; }
.sale-admin-price del { color: #757d7f; font-size: 11px; }
.sale-admin-body dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0 0 16px; }
.sale-admin-body dl div { min-width: 0; padding: 9px; border: 1px solid rgba(255,255,255,.06); border-radius: 8px; background: rgba(255,255,255,.018); }
.sale-admin-body dt { color: #788083; font-size: 9px; }
.sale-admin-body dd { margin: 2px 0 0; overflow-wrap: anywhere; font-size: 11px; font-weight: 700; }
.sale-quick-status { display: grid; gap: 7px; padding: 11px; margin: 0 0 14px; border: 1px solid rgba(218,166,63,.14); border-radius: 10px; background: rgba(218,166,63,.025); }
.sale-quick-status > span { color: var(--admin-muted); font-size: 9px; font-weight: 800; }
.sale-quick-status > div { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; }
.sale-status-button { min-height: 34px; padding: 6px 8px; border: 1px solid rgba(255,255,255,.11); border-radius: 8px; color: #bdc3c4; background: rgba(255,255,255,.025); cursor: pointer; font-size: 10px; font-weight: 800; transition: .18s ease; }
.sale-status-button:hover:not(:disabled) { transform: translateY(-1px); filter: brightness(1.12); }
.sale-status-button.available { color: #67d79a; border-color: rgba(67,189,129,.3); }
.sale-status-button.reserved { color: #efbd58; border-color: rgba(218,166,63,.34); }
.sale-status-button.sold { color: #ef7779; border-color: rgba(226,77,79,.3); }
.sale-status-button.active { color: #111; cursor: default; box-shadow: 0 6px 16px rgba(0,0,0,.18); }
.sale-status-button.available.active { background: #67d79a; }
.sale-status-button.reserved.active { background: #efbd58; }
.sale-status-button.sold.active { color: #fff; background: #b82e31; }
.sale-parent-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.sale-parent-box { display: grid; gap: 13px; padding: 17px; border: 1px solid rgba(218,166,63,.18); border-radius: 11px; background: rgba(218,166,63,.025); }
.sale-parent-box > strong { color: var(--admin-gold-light); font-size: 13px; }

@media (max-width: 1180px) {
    .sale-admin-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
    .sale-admin-filter, .sale-parent-grid, .sale-admin-grid { grid-template-columns: 1fr; }
    .sale-admin-filter .search-field { grid-column: 1 / -1; }
}

.inquiry-summary { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.inquiry-summary article { display: grid; gap: 4px; min-height: 92px; padding: 16px; border: 1px solid rgba(218,166,63,.18); border-radius: 12px; background: linear-gradient(140deg, rgba(218,166,63,.08), rgba(255,255,255,.018)); }
.inquiry-summary span { color: var(--admin-muted); font-size: 10px; }
.inquiry-summary strong { color: var(--admin-gold-light); font: 800 27px Georgia, serif; }
.inquiry-list { display: grid; gap: 12px; }
.inquiry-card { display: grid; grid-template-columns: 170px minmax(230px, .9fr) minmax(220px, .8fr) minmax(300px, 1.15fr); gap: 18px; align-items: center; padding: 16px; }
.inquiry-reference, .inquiry-customer { display: grid; align-content: center; gap: 6px; min-width: 0; }
.inquiry-reference .status { justify-self: start; }
.inquiry-reference code { color: var(--admin-gold-light); font-size: 12px; font-weight: 800; overflow-wrap: anywhere; }
.inquiry-reference small, .inquiry-customer small, .inquiry-customer em { color: var(--admin-muted); font-size: 9px; font-style: normal; overflow-wrap: anywhere; }
.inquiry-chicken { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 12px; align-items: center; min-width: 0; }
.inquiry-chicken img { width: 72px; height: 82px; border: 1px solid rgba(218,166,63,.22); border-radius: 9px; object-fit: cover; background: #0b0d0e; }
.inquiry-chicken > div { display: grid; gap: 3px; min-width: 0; }
.inquiry-chicken strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.inquiry-chicken span { color: var(--admin-muted); font-size: 9px; }
.inquiry-chicken b { color: var(--admin-gold-light); font: 800 16px Georgia, serif; }
.inquiry-chicken a { color: var(--admin-gold); font-size: 9px; font-weight: 800; }
.inquiry-customer > span { color: var(--admin-muted); font-size: 9px; }
.inquiry-customer strong { font-size: 12px; }
.inquiry-status-form { display: grid; grid-template-columns: 145px minmax(150px, 1fr) auto; gap: 8px; align-items: end; }
.inquiry-status-form label { display: grid; gap: 5px; min-width: 0; }
.inquiry-status-form label span { color: var(--admin-muted); font-size: 9px; }
.inquiry-status-form select, .inquiry-status-form input { width: 100%; min-height: 40px; }
.inquiry-status-form .btn { min-height: 40px; }

@media (max-width: 1280px) {
    .inquiry-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .inquiry-card { grid-template-columns: 160px minmax(220px, 1fr) minmax(220px, 1fr); }
    .inquiry-status-form { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
    .inquiry-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .inquiry-card { grid-template-columns: 1fr; }
    .inquiry-status-form { grid-column: auto; grid-template-columns: 1fr; }
    .inquiry-status-form .btn { width: 100%; }
}

[data-theme="light"] th { color: #77746e; }
[data-theme="light"] td { color: #424748; }
[data-theme="light"] th,
[data-theme="light"] td,
[data-theme="light"] .summary-row,
[data-theme="light"] .form-section + .form-section,
[data-theme="light"] .form-actions { border-color: rgba(116,82,33,.12); }
[data-theme="light"] .quick-item,
[data-theme="light"] .analytics-status-strip > div,
[data-theme="light"] .analytics-setup li,
[data-theme="light"] .analytics-secondary-stats > div,
[data-theme="light"] .analytics-device-list > div,
[data-theme="light"] .sale-admin-body dl div { border-color: rgba(116,82,33,.13); background: rgba(165,109,25,.035); }
[data-theme="light"] .sale-quick-status { border-color: rgba(116,82,33,.17); background: rgba(165,109,25,.045); }
[data-theme="light"] .sale-status-button:not(.active) { color: #5f5547; border-color: rgba(116,82,33,.18); background: rgba(255,255,255,.76); }
[data-theme="light"] .stat-card small,
[data-theme="light"] .summary-row,
[data-theme="light"] .analytics-status-strip strong,
[data-theme="light"] .analytics-setup li strong,
[data-theme="light"] .analytics-secondary-stats strong,
[data-theme="light"] .analytics-bar-row strong,
[data-theme="light"] .analytics-device-list strong { color: #4c5253; }
[data-theme="light"] .detail-list { border-color: rgba(116,82,33,.13); background: rgba(116,82,33,.13); }
[data-theme="light"] .detail-list div,
[data-theme="light"] .popup-media-editor,
[data-theme="light"] .certificate-image-preview { background: #fbf8f1; }
[data-theme="light"] tbody tr:hover { background: rgba(168,106,19,.045); }
[data-theme="light"] .sale-admin-image,
[data-theme="light"] .inquiry-chicken img { background: #eee9df; }
[data-theme="light"] .sidebar-contact { color: #f5ecec; }

@media (max-width: 620px) {
    .topbar-title > div > span { display: none; }
    .topbar-title h1 { max-width: 135px; overflow: hidden; font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }
    .admin-topbar-actions { gap: 6px; }
}

@media print {
    @page { size: A4 landscape; margin: 0; }
    html, body.breed-print-body { width: 297mm; height: 210mm; margin: 0; padding: 0; overflow: hidden; background: #fff; }
    .breed-print-body .print-toolbar { display: none; }
    .breed-certificate-sheet { width: 297mm; height: 210mm; margin: 0; box-shadow: none; }
}

/* Uploaded LINE OA QR management */
.settings-line-qr-section { margin-top: 27px; padding-top: 25px; border-top: 1px solid rgba(218,166,63,.16); scroll-margin-top: 105px; }
.line-qr-code-preview { aspect-ratio: 1; background: #fff; }
.line-qr-code-preview img { padding: 9px; object-fit: contain; }
.line-qr-code-preview > span { display: grid; place-items: center; width: 68px; height: 68px; border-radius: 18px; color: #fff; background: #06c755; font: 900 17px/1 Arial,sans-serif; }
.line-qr-remove { margin-top: 12px; }

/* Exact A4 landscape certificate based on the supplied transparent PNG template. */
.breed-print-body { min-width: 1123px; padding: 24px; overflow: auto; color: #10254a; background: #d8d3c9; }
.breed-certificate-sheet {
    position: relative;
    box-sizing: border-box;
    width: 297mm;
    height: 210mm;
    margin: 0 auto;
    padding: 0;
    overflow: hidden;
    font-family: "Sarabun", "Noto Sans Thai", Tahoma, Arial, sans-serif;
    background: #fffaf2;
    box-shadow: 0 24px 70px rgba(36,27,17,.28);
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
}
.breed-certificate-template { position: absolute; z-index: 2; inset: 0; display: block; width: 100%; height: 100%; pointer-events: none; user-select: none; }
.breed-template-media { position: absolute; z-index: 1; overflow: hidden; background: #fffaf2; }
.breed-template-media > img { display: block; width: 100%; height: 100%; object-fit: contain; }
.breed-template-photo { top: 15.370%; left: 7.574%; width: 30.630%; height: 57.211%; }
.breed-template-line-qr { top: 77.979%; left: 10.386%; width: 8.250%; height: 11.500%; background: #fff; }
.breed-template-line-qr > img,.certificate-qr-canvas.line > img { filter: grayscale(1) brightness(.55) contrast(10); }
.breed-template-verify-qr { top: 77.979%; left: 26.815%; width: 8.100%; height: 11.500%; background: #fff; }
.breed-template-line-qr > span,.breed-template-verify-qr > span { position: absolute; top: 50%; left: 50%; display: grid; place-items: center; box-sizing: border-box; width: 24%; aspect-ratio: 1; padding: 2.5%; overflow: hidden; border: 3px solid #fff; border-radius: 18%; background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,.22); transform: translate(-50%,-50%); }
.breed-template-line-qr > span img,.breed-template-verify-qr > span img { width: 100%; height: 100%; border-radius: 10%; object-fit: cover; }
.breed-template-value { position: absolute; z-index: 3; display: flex; align-items: center; justify-content: center; height: 4.5%; overflow: hidden; color: #10254a; font-family: "Sarabun", sans-serif; font-size: 4.8mm; font-weight: 700; line-height: 1; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.breed-template-delivery-date { top: 55.55%; left: 49.10%; width: 12.00%; }
.breed-template-owner { top: 55.55%; left: 69.70%; width: 24.50%; }
.breed-template-father { top: 62.25%; left: 48.25%; width: 45.35%; }
.breed-template-mother { top: 68.95%; left: 48.25%; width: 45.35%; }
.breed-template-birth-date { top: 76.05%; left: 43.20%; width: 8.70%; font-size: 4.0mm; }
.breed-template-gift-number { top: 76.05%; left: 59.60%; width: 9.65%; font-size: 4.3mm; }
.breed-template-breed { top: 76.05%; left: 74.90%; width: 9.80%; font-size: 4.3mm; }
.breed-template-sex { top: 76.05%; left: 88.25%; width: 6.00%; font-size: 4.3mm; }
.breed-template-certificate-number { position: absolute; z-index: 4; top: 69.10%; left: 9.10%; display: flex; align-items: center; justify-content: center; box-sizing: border-box; width: 27.60%; min-height: 3.15%; padding: .45mm 1.5mm; border: .22mm solid rgba(233,190,89,.82); border-radius: 8mm; color: #fff4d0; font-family: "Sarabun", sans-serif; font-size: 2.9mm; font-weight: 700; letter-spacing: .08mm; text-align: center; background: rgba(8,27,49,.82); box-shadow: 0 1mm 2.5mm rgba(0,0,0,.22); }

@media print {
    @page { size: A4 landscape; margin: 0; }
    html, body.breed-print-body { width: 297mm; height: 210mm; margin: 0; padding: 0; overflow: hidden; background: #fff; }
    .breed-print-body .print-toolbar { display: none; }
    .breed-certificate-sheet { width: 297mm; height: 210mm; margin: 0; box-shadow: none; }
}