/* Phase 2 — Canonical UI Components */
.sg-page,.sg-section{display:block;min-width:0;}
.sg-page{display:grid;gap:var(--sg-space-6);}
.sg-section{display:grid;gap:var(--sg-space-4);}

/* Pagehead */
.sg-pagehead{display:grid;gap:8px;min-width:0;}
.sg-pagehead__eyebrow{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--sg-text-soft);}
.sg-pagehead__title,.sg-pagehead-title{margin:0;font-size:clamp(22px,2vw,30px);line-height:1.14;font-weight:850;color:var(--sg-text);}
.sg-pagehead__subtitle,.sg-pagehead-subtitle{margin:0;color:var(--sg-muted);font-size:14px;line-height:1.7;max-width:80ch;}
.sg-pagehead__meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:var(--sg-text-soft);font-size:13px;}

/* Cards */
.sg-card{
  background:var(--sg-surface);
  border:1px solid var(--sg-border);
  border-radius:var(--sg-radius-lg);
  box-shadow:var(--sg-shadow-sm);
  color:var(--sg-text);
  min-width:0;
}
.sg-card--section,.sg-card-section{overflow:hidden;}
.sg-card--nested,.sg-card-nested{background:var(--sg-surface-2);box-shadow:none;}
.sg-card--filter,.sg-card-filter{background:color-mix(in srgb,var(--sg-surface) 84%,var(--sg-primary-soft));}
.sg-card--stat,.sg-card-stat{position:relative;overflow:hidden;min-height:132px;}
.sg-card--stat::after,.sg-card-stat::after{
  content:"";position:absolute;inset:auto -18px -18px auto;width:92px;height:92px;border-radius:999px;
  background:color-mix(in srgb,var(--sg-primary) 12%,transparent);pointer-events:none;
}
.sg-card__head,.sg-card-head,.sg-card-header{
  display:flex;align-items:flex-start;justify-content:space-between;gap:12px;
  padding:16px 18px;border-bottom:1px solid var(--sg-border);min-width:0;
}
.sg-card__body,.sg-card-body{padding:18px;display:grid;gap:14px;min-width:0;}
.sg-card__foot,.sg-card-foot,.sg-card-footer{
  display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap;
  padding:14px 18px;border-top:1px solid var(--sg-border);background:var(--sg-surface-2);
}
.sg-card__title,.sg-card-title{margin:0;font-size:16px;font-weight:800;color:var(--sg-text);}
.sg-card__subtitle,.sg-card-subtitle{margin:4px 0 0;color:var(--sg-muted);font-size:13px;line-height:1.6;}

/* KPI / stat */
.sg-kpi-card,.sg-card.sg-kpi-card{position:relative;overflow:hidden;}
.sg-kpi-card__label,.sg-stat-label{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--sg-muted);}
.sg-kpi-card__value,.sg-stat-value{font-size:30px;line-height:1.08;font-weight:850;color:var(--sg-text);}
.sg-kpi-card__delta{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:800;color:var(--sg-kpi-positive);}
.sg-kpi-card__delta.is-negative{color:var(--sg-kpi-negative);}
.sg-kpi-card__sub,.sg-stat-note{font-size:13px;color:var(--sg-muted);line-height:1.65;}
.sg-stat-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
.sg-stat-row > *{min-width:0;}

/* Toolbar / filterbar / actionbar */
.sg-toolbar,.sg-filterbar,.sg-actionbar{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  min-height:var(--sg-toolbar-min-h);padding:14px 16px;border:1px solid var(--sg-border);
  background:var(--sg-surface);border-radius:var(--sg-radius-lg);box-shadow:var(--sg-shadow-sm);min-width:0;
}
.sg-toolbar__group,.sg-toolbar-group,.sg-filterbar__group,.sg-filterbar-group{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0;}
.sg-toolbar__spacer,.sg-toolbar-spacer{flex:1 1 auto;min-width:20px;}
.sg-toolbar-main,.sg-filterbar-main{display:flex;align-items:center;gap:12px;flex:1 1 420px;flex-wrap:wrap;min-width:0;}
.sg-toolbar-actions,.sg-filterbar-actions{display:flex;align-items:center;gap:10px;justify-content:flex-end;flex:0 0 auto;flex-wrap:wrap;min-width:0;}
.sg-actionbar{position:sticky;bottom:0;z-index:var(--sg-z-tablehead,18);padding-block:12px;background:color-mix(in srgb,var(--sg-surface) 92%,var(--sg-surface-elevated));backdrop-filter:blur(10px);}

/* Form system */
.sg-form{display:grid;gap:16px;min-width:0;}
.sg-form-row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:12px;min-width:0;}
.sg-form-row > *{grid-column:span 12;min-width:0;}
.sg-form-row > .span-2{grid-column:span 2;}
.sg-form-row > .span-3{grid-column:span 3;}
.sg-form-row > .span-4{grid-column:span 4;}
.sg-form-row > .span-5{grid-column:span 5;}
.sg-form-row > .span-6{grid-column:span 6;}
.sg-form-row > .span-7{grid-column:span 7;}
.sg-form-row > .span-8{grid-column:span 8;}
.sg-form-row > .span-9{grid-column:span 9;}
.sg-form-row > .span-10{grid-column:span 10;}
.sg-form-row > .span-11{grid-column:span 11;}
.sg-field{display:grid;gap:8px;min-width:0;}
.sg-field-group{display:grid;gap:10px;min-width:0;}
.sg-label,.sg-field > label{font-size:13px;font-weight:700;color:var(--sg-text-soft);line-height:1.4;}
.sg-help{font-size:13px;color:var(--sg-muted);line-height:1.55;}
.sg-error{font-size:12px;font-weight:700;color:var(--sg-danger);}
.sg-input,.sg-select,.sg-textarea,textarea.sg-input{
  width:100%;min-height:var(--sg-input-h);padding:10px 12px;border:1px solid var(--sg-border);
  border-radius:var(--sg-radius-md);background:var(--sg-surface);color:var(--sg-text);
  outline:none;transition:border-color .18s ease,box-shadow .18s ease,color .18s ease,opacity .18s ease,background-color .18s ease,border-radius .18s ease;
}
.sg-select-wrap,.sg-search,.sg-input-ico{position:relative;display:block;width:100%;min-width:0;}
/* Native select shell canonical: prefer .sg-select for all new selects; keep select.sg-input only as legacy compatibility. */
.sg-select-wrap > .sg-select,
.sg-select-wrap > select.sg-input{appearance:none;padding-right:42px;background-image:none;}
.sg-select-wrap::after{content:'\f078';font-family:'Font Awesome 6 Pro';font-weight:900;position:absolute;right:14px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--sg-muted);font-size:12px;line-height:1;transition:color .18s ease,transform .18s ease,opacity .18s ease;}
.sg-select-wrap:focus-within::after{color:var(--sg-primary);}
.sg-select-wrap.is-disabled::after{opacity:.55;}
.sg-select--compact,.sg-select-wrap.is-compact > .sg-select,.sg-select-wrap.is-compact > select.sg-input{min-height:40px;height:40px;border-radius:12px;}
.sg-input::placeholder,.sg-textarea::placeholder{color:var(--sg-muted);}
.sg-field > :where(.sg-input,.sg-select,.sg-textarea,.sg-select-wrap,.sg-search,.sg-input-ico){min-width:0;max-width:100%;margin:0;}
.sg-input--search,
input.sg-input[type=search],
input.sg-input[placeholder*='Tìm'],
input.sg-input[placeholder*='tìm'],
input.sg-input[placeholder*='Search'],
input.sg-input[placeholder*='search']{
  padding-left:40px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:14px 50%;
  background-size:14px 14px;
}
.sg-input--search::placeholder,
input.sg-input[type=search]::placeholder,
input.sg-input[placeholder*='Tìm']::placeholder,
input.sg-input[placeholder*='tìm']::placeholder,
input.sg-input[placeholder*='Search']::placeholder,
input.sg-input[placeholder*='search']::placeholder{color:var(--sg-muted);}
.sg-input:hover,.sg-select:hover,.sg-textarea:hover{border-color:var(--sg-border-strong);}
.sg-input:focus,.sg-select:focus,.sg-textarea:focus,textarea.sg-input:focus{
  border-color:var(--sg-primary);box-shadow:0 0 0 4px color-mix(in srgb,var(--sg-primary) 18%,transparent);
}
.sg-input[disabled],.sg-select[disabled],.sg-textarea[disabled]{opacity:.66;cursor:not-allowed;background:var(--sg-surface-2);}
.sg-select{
  appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--sg-muted) 50%),linear-gradient(135deg,var(--sg-muted) 50%,transparent 50%);
  background-position:calc(100% - 18px) calc(50% - 2px),calc(100% - 12px) calc(50% - 2px);
  background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:34px;transition:border-color .18s ease,box-shadow .18s ease,color .18s ease,opacity .18s ease,background-color .18s ease;
}
.sg-select option,select.sg-input option{background:var(--sg-surface);color:var(--sg-text);}
.sg-select:disabled,select.sg-input:disabled{background-color:var(--sg-surface-2);color:var(--sg-muted);}
.sg-textarea,textarea.sg-input{min-height:112px;resize:vertical;}
.sg-input-group{display:flex;align-items:stretch;width:100%;min-width:0;}
.sg-input-group > .sg-input,.sg-input-group > .sg-select{border-radius:0;flex:1 1 auto;min-width:0;}
.sg-input-group > :first-child{border-top-left-radius:var(--sg-radius-md);border-bottom-left-radius:var(--sg-radius-md);}
.sg-input-group > :last-child{border-top-right-radius:var(--sg-radius-md);border-bottom-right-radius:var(--sg-radius-md);}
.sg-input-affix{display:inline-flex;align-items:center;justify-content:center;padding:0 12px;border:1px solid var(--sg-border);background:var(--sg-surface-2);color:var(--sg-muted);font-weight:700;}
.sg-search .sg-input{padding-left:40px;}
.sg-search-ico{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--sg-muted);pointer-events:none;}
.sg-check,.sg-radio{position:relative;display:inline-flex;align-items:flex-start;gap:10px;color:var(--sg-text);cursor:pointer;line-height:1.45;min-width:0;max-width:100%;}
.sg-check input,.sg-radio input{position:absolute;inline-size:1px;block-size:1px;margin:-1px;padding:0;border:0;opacity:0;pointer-events:none;clip-path:inset(50%);overflow:hidden;white-space:nowrap;}
.sg-check-box,.sg-radio-dot{flex:0 0 18px;width:18px;height:18px;border:1px solid var(--sg-border-strong);background:var(--sg-surface);box-shadow:inset 0 1px 0 color-mix(in srgb,var(--sg-surface) 94%, var(--sg-text) 6%);transition:all .18s ease;margin-top:1px;}
.sg-check-box{border-radius:6px;}
.sg-radio-dot{border-radius:999px;}
.sg-check input:checked + .sg-check-box{background:var(--sg-primary);border-color:var(--sg-primary);box-shadow:inset 0 0 0 4px color-mix(in srgb,var(--sg-primary) 24%,var(--sg-surface) 76%);}
.sg-radio input:checked + .sg-radio-dot{border-color:var(--sg-primary);box-shadow:inset 0 0 0 5px var(--sg-primary);}
.sg-check-text,.sg-radio-text{display:grid;gap:2px;min-width:0;}
.sg-check-text small,.sg-radio-text small{color:var(--sg-muted);font-size:12px;line-height:1.55;}

/* Buttons */
.sg-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:0;
  min-height:40px;padding:0 14px;border-radius:12px;border:1px solid var(--sg-border);
  background:var(--sg-surface);color:var(--sg-text);font-weight:750;text-decoration:none;cursor:pointer;
  transition:transform .12s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease,color .18s ease,opacity .18s ease;
}
.sg-btn:hover{transform:translateY(-1px);box-shadow:var(--sg-shadow-sm);}
.sg-btn:focus-visible{outline:none;box-shadow:0 0 0 4px color-mix(in srgb,var(--sg-primary) 18%,transparent);}
.sg-btn[disabled],.sg-btn.is-disabled{opacity:.58;pointer-events:none;box-shadow:none;transform:none;}
.sg-btn--primary,.sg-btn-primary{background:var(--sg-primary);border-color:var(--sg-primary);color:var(--sg-text-on-primary);}
.sg-btn--secondary,.sg-btn-secondary{background:var(--sg-surface-2);border-color:var(--sg-border-strong);}
.sg-btn--ghost,.sg-btn-ghost{background:transparent;box-shadow:none;}
.sg-btn--danger,.sg-btn-danger{background:var(--sg-danger);border-color:var(--sg-danger);color:var(--sg-text-on-danger);}
.sg-btn--icon,.sg-btn-icon{width:40px;min-width:40px;padding:0;}
.sg-btn--sm{min-height:34px;padding:0 12px;border-radius:10px;font-size:13px;}
.sg-btn--lg{min-height:46px;padding:0 18px;border-radius:14px;}
.sg-btn--block{display:flex;width:100%;}
html.theme-dark .sg-btn--primary,html.theme-dark .sg-btn-primary,html.theme-dark .sg-btn--danger,html.theme-dark .sg-btn-danger{color:var(--sg-text-on-primary);}

/* Badge / pill */
.sg-badge,.sg-pill,.sg-tab-badge,.sg-sidebar-badge{
  display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:0 10px;border-radius:999px;border:1px solid transparent;font-size:12px;font-weight:800;line-height:1;
}
.sg-badge--neutral,.sg-badge-neutral,.sg-pill{background:var(--sg-neutral-soft);border-color:color-mix(in srgb,var(--sg-neutral) 24%,transparent);color:var(--sg-neutral);}
.sg-badge--info,.sg-badge-info{background:var(--sg-info-soft);border-color:color-mix(in srgb,var(--sg-info) 24%,transparent);color:var(--sg-info);}
.sg-badge--success,.sg-badge-success{background:var(--sg-success-soft);border-color:color-mix(in srgb,var(--sg-success) 24%,transparent);color:var(--sg-success);}
.sg-badge--warning,.sg-badge-warning{background:var(--sg-warning-soft);border-color:color-mix(in srgb,var(--sg-warning) 24%,transparent);color:var(--sg-warning);}
.sg-badge--danger,.sg-badge-danger{background:var(--sg-danger-soft);border-color:color-mix(in srgb,var(--sg-danger) 24%,transparent);color:var(--sg-danger);}
.sg-badge--purple,.sg-badge-purple{background:var(--sg-purple-soft);border-color:color-mix(in srgb,var(--sg-purple) 24%,transparent);color:var(--sg-purple);}
.sg-badge.is-solid,.sg-tab-badge.is-solid,.sg-sidebar-badge.is-solid{background:currentColor;color:var(--sg-text-on-solid);border-color:transparent;}
.sg-badge.is-danger,.sg-tab-badge.is-danger,.sg-sidebar-badge.is-danger{color:var(--sg-danger);}
.sg-badge.is-warning,.sg-tab-badge.is-warning,.sg-sidebar-badge.is-warning{color:var(--sg-warning);}
.sg-badge.is-info,.sg-tab-badge.is-info,.sg-sidebar-badge.is-info{color:var(--sg-info);}
.sg-badge.is-success,.sg-tab-badge.is-success,.sg-sidebar-badge.is-success{color:var(--sg-success);}
.sg-tab-badge,.sg-sidebar-badge{min-height:22px;padding:0 8px;font-size:11px;}

/* Table */
.sg-table-wrap{overflow:auto;border:1px solid var(--sg-border);border-radius:var(--sg-radius-lg);background:var(--sg-surface);box-shadow:var(--sg-shadow-sm);min-width:0;}

.sg-row-main{font-weight:700;color:var(--sg-text);}
.sg-row-meta{font-size:12px;color:var(--sg-muted);line-height:1.6;}
.sg-row-note{font-size:12px;color:var(--sg-text-soft);line-height:1.6;}

.sg-dropdown{position:relative;min-width:0;}
.sg-dropdown__list{position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:var(--sg-z-dropdown,40);display:none;max-height:320px;overflow:auto;}
.sg-dropdown.is-open .sg-dropdown__list{display:block;}
.sg-dropdown__item{display:flex;width:100%;text-align:left;align-items:flex-start;justify-content:space-between;border:0;background:transparent;color:inherit;cursor:pointer;}
.sg-dropdown__meta,.sg-dropdown__name,.sg-dropdown__empty{display:block;}


.sg-table{width:100%;border-collapse:separate;border-spacing:0;background:var(--sg-surface);color:var(--sg-text);min-width:640px;}
.sg-table thead th{position:sticky;top:0;z-index:var(--sg-z-tablehead,18);padding:14px 16px;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--sg-muted);background:var(--sg-surface-2);border-bottom:1px solid var(--sg-border);text-align:left;white-space:nowrap;}
.sg-table tbody td{padding:14px 16px;border-bottom:1px solid var(--sg-border);vertical-align:middle;min-height:var(--sg-table-row-h);}
.sg-table tbody tr:hover td{background:color-mix(in srgb,var(--sg-primary) 4%,var(--sg-surface));}
.sg-table tr:last-child td{border-bottom:none;}
.sg-table--compact,.sg-table.is-compact{font-size:13px;}
.sg-table--compact tbody td,.sg-table.is-compact tbody td{padding:10px 14px;min-height:var(--sg-table-row-h-compact);}
.sg-table--relaxed,.sg-table.is-relaxed{font-size:15px;}
.sg-table--relaxed tbody td,.sg-table.is-relaxed tbody td{padding:16px 18px;min-height:var(--sg-table-row-h-relaxed);}
.sg-table__actions,.sg-table-actions{display:flex;align-items:center;gap:8px;justify-content:flex-end;flex-wrap:wrap;}
.sg-table__meta{display:grid;gap:2px;font-size:12px;color:var(--sg-muted);}
.sg-table__empty,.sg-table-empty{display:grid;gap:8px;justify-items:center;text-align:center;padding:30px 18px;color:var(--sg-muted);}
.sg-table__empty strong,.sg-table-empty strong{color:var(--sg-text);}

/* Progress / charts */
.sg-progress{display:flex;align-items:flex-end;gap:8px;height:220px;padding:8px 6px 0;}
.sg-progress__item{flex:1;min-width:20px;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:8px;}
.sg-progress__bar{width:100%;max-width:48px;background:linear-gradient(180deg,var(--sg-info),var(--sg-primary));border-radius:12px 12px 4px 4px;min-height:4px;}
.sg-progress__bar--metric{height:var(--sg-progress-h,4px);}
.sg-progress__label{font-size:11px;color:var(--sg-muted);text-align:center;}
.sg-progress__value{font-size:11px;font-weight:700;color:var(--sg-text);}


/* Tabs */
.sg-tabs{display:flex;align-items:center;gap:8px;flex-wrap:nowrap;overflow:auto hidden;padding-bottom:4px;scrollbar-width:thin;min-width:0;}
.sg-tab{
  display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;white-space:nowrap;
  border-radius:12px;border:1px solid transparent;background:transparent;color:var(--sg-muted);font-weight:750;text-decoration:none;position:relative;
}
.sg-tab:hover{background:var(--sg-surface-2);color:var(--sg-text);}
.sg-tab.is-active,.sg-tab[aria-current="page"],.sg-tab[aria-selected="true"]{background:var(--sg-primary-soft);color:var(--sg-primary);border-color:color-mix(in srgb,var(--sg-primary) 22%,transparent);}
.sg-tab.has-notification{padding-right:10px;}
.sg-tab.has-notification .sg-tab-badge{margin-left:2px;}
.sg-subtabs .sg-tab{min-height:34px;padding:0 12px;border-radius:10px;font-size:13px;}

/* Modal / drawer */
.sg-modal,.sg-drawer{background:var(--sg-surface);color:var(--sg-text);border:1px solid var(--sg-border);border-radius:var(--sg-radius-xl);box-shadow:var(--sg-shadow-xl);min-width:0;}
.sg-modal__dialog{width:min(680px,calc(100vw - 24px));}
.sg-drawer__panel{width:min(760px,100%);}
.sg-modal-header,.sg-drawer-header,.sg-modal-head,.sg-drawer-head,.sg-modal__head,.sg-drawer__head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:18px 20px;border-bottom:1px solid var(--sg-border);}
.sg-modal-body,.sg-drawer-body,.sg-modal__body,.sg-drawer__body{padding:20px;display:grid;gap:16px;min-width:0;}
.sg-modal-footer,.sg-drawer-footer,.sg-modal__foot,.sg-drawer__foot,.sg-sticky-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap;padding:14px 20px;border-top:1px solid var(--sg-border);background:var(--sg-surface-2);}
.sg-sticky-actions{position:sticky;bottom:0;z-index:var(--sg-z-tablehead,18);}
.sg-modal,.sg-modal__dialog{width:min(680px,calc(100vw - 24px));}
.sg-drawer,.sg-drawer__panel{width:min(760px,100%);}
.sg-modal__title,.sg-drawer__title{margin:0;font-size:18px;line-height:1.25;font-weight:800;}
.sg-modal__subtitle,.sg-drawer__subtitle{margin:4px 0 0;color:var(--sg-muted);font-size:13px;line-height:1.6;}

/* Timeline / audit */
.sg-timeline{display:grid;gap:12px;position:relative;min-width:0;}
.sg-timeline__item{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:flex-start;min-width:0;}
.sg-timeline__dot{width:12px;height:12px;border-radius:999px;background:var(--sg-primary);margin-top:7px;box-shadow:0 0 0 4px color-mix(in srgb,var(--sg-primary) 15%,transparent);}
.sg-timeline__content{display:grid;gap:4px;min-width:0;padding:12px 14px;border:1px solid var(--sg-border);border-radius:var(--sg-radius-md);background:var(--sg-surface-2);}
.sg-timeline__title{margin:0;font-size:14px;font-weight:800;color:var(--sg-text);}
.sg-timeline__meta{font-size:12px;color:var(--sg-text-soft);}
.sg-timeline__desc{font-size:13px;line-height:1.65;color:var(--sg-muted);}

/* Empty / state */
.sg-empty{display:grid;justify-items:center;gap:8px;padding:28px 20px;border:1px dashed var(--sg-border-strong);border-radius:var(--sg-radius-lg);background:var(--sg-surface-2);text-align:center;color:var(--sg-muted);}
.sg-empty__icon{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:color-mix(in srgb,var(--sg-primary-soft) 72%,var(--sg-surface));color:var(--sg-primary);font-size:20px;}
.sg-empty__title{font-size:15px;font-weight:800;color:var(--sg-text);}
.sg-empty__desc{font-size:13px;line-height:1.65;max-width:52ch;}
.sg-empty-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:10px}
.sg-empty-actions .sg-btn{min-height:40px}
.sg-disabled-note{margin-top:8px;font-size:12px;line-height:1.55;color:var(--sg-muted);}
.sg-btn[disabled][data-disabled-reason],.sg-tab[disabled][data-disabled-reason],button[aria-disabled="true"][data-disabled-reason]{cursor:not-allowed;}

/* Phase 6 — canonical action / confirm / empty / sticky footer */
.sg-actionbar{position:sticky;bottom:0;z-index:var(--sg-z-filter,28);padding-block:12px;background:color-mix(in srgb,var(--sg-surface) 92%,var(--sg-surface-elevated));backdrop-filter:blur(10px);}
.sg-actionbar__main,.sg-actionbar__meta,.sg-actionbar__actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0;}
.sg-actionbar__main,.sg-actionbar__meta{flex:1 1 240px;}
.sg-actionbar__actions{justify-content:flex-end;flex:0 0 auto;}
.sg-row-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;min-width:0;}
.sg-row-actions--start{justify-content:flex-start;}
.sg-row-actions--compact{gap:6px;}
.sg-row-actions > form{margin:0;}
.sg-row-actions__more,.sg-row-actions details{position:relative;display:inline-flex;align-items:center;}
.sg-row-actions__more > summary,.sg-row-actions details > summary{list-style:none;cursor:pointer;}
.sg-row-actions__more > summary::-webkit-details-marker,.sg-row-actions details > summary::-webkit-details-marker{display:none;}
.sg-row-actions__menu,.sg-row-actions details .sg-inline-actions__menu{position:absolute;top:calc(100% + 8px);right:0;min-width:220px;max-width:min(320px,calc(100vw - 24px));z-index:var(--sg-z-dropdown);padding:8px;border-radius:18px;border:1px solid var(--sg-border);background:var(--sg-surface);box-shadow:var(--sg-shadow-lg);display:grid;gap:4px;}
.sg-row-actions__menu .sg-btn,.sg-row-actions details .sg-inline-actions__menu .sg-btn{justify-content:flex-start;width:100%;}
.sg-row-actions__more[open],.sg-row-actions details[open]{z-index:var(--sg-z-dropdown);}
.sg-confirm-dialog .sg-dialog-h,.sg-dialog.sg-confirm-dialog .sg-dialog-h{padding:16px 16px 12px;}
.sg-confirm-dialog .sg-dialog-b,.sg-dialog.sg-confirm-dialog .sg-dialog-b{padding:16px;display:grid;gap:10px;}
.sg-confirm-dialog .sg-dialog-f,.sg-dialog.sg-confirm-dialog .sg-dialog-f{padding:14px 16px 16px;}
.sg-confirm-dialog .sg-dialog-ico,.sg-dialog.sg-confirm-dialog .sg-dialog-ico{background:var(--sg-warning-soft);color:var(--sg-warning);}
.sg-confirm-dialog.sg-dialog-danger .sg-dialog-ico,.sg-dialog.sg-confirm-dialog.sg-dialog-danger .sg-dialog-ico{background:var(--sg-danger-soft);color:var(--sg-danger);}
.sg-empty,.sg-empty-state{display:grid;justify-items:center;gap:8px;padding:28px 20px;border:1px dashed var(--sg-border-strong);border-radius:var(--sg-radius-lg);background:var(--sg-surface-2);text-align:center;color:var(--sg-muted);}
.sg-empty-state__icon,.sg-empty__icon{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:color-mix(in srgb,var(--sg-primary-soft) 72%,var(--sg-surface));color:var(--sg-primary);font-size:20px;}
.sg-empty-state__title,.sg-empty__title{font-size:15px;font-weight:800;color:var(--sg-text);}
.sg-empty-state__desc,.sg-empty__desc{font-size:13px;line-height:1.65;max-width:52ch;}
.sg-empty-state__actions,.sg-empty-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:10px;}
.sg-empty-state__actions .sg-btn,.sg-empty-actions .sg-btn{min-height:40px;}
.sg-form-footer-sticky{position:sticky;bottom:0;z-index:var(--sg-z-filter,28);display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap;padding:14px 16px;border-top:1px solid var(--sg-border);background:color-mix(in srgb,var(--sg-surface) 90%,var(--sg-surface-elevated));backdrop-filter:blur(10px);margin:18px -18px -18px;}
@media (max-width: 900px){
  .sg-actionbar,.sg-form-footer-sticky{padding-left:14px;padding-right:14px;}
  .sg-actionbar__actions,.sg-row-actions{justify-content:flex-start;}
}
@media (max-width: 767px){
  .sg-actionbar__main,.sg-actionbar__meta,.sg-actionbar__actions{flex-basis:100%;width:100%;}
  .sg-actionbar__actions > :where(.sg-btn,a.sg-btn,button.sg-btn),
  .sg-row-actions > :where(.sg-btn,a.sg-btn,button.sg-btn){flex:1 1 calc(50% - 4px);justify-content:center;}
  .sg-form-footer-sticky > :where(.sg-btn,a.sg-btn,button.sg-btn){flex:1 1 calc(50% - 4px);justify-content:center;}
}



@media (max-width: 1100px){
  .sg-stat-row{grid-template-columns:1fr;}
}
@media (max-width: 900px){
  .sg-card__head,.sg-card-head,.sg-card__body,.sg-card-body,.sg-card__foot,.sg-card-foot,.sg-card-footer,.sg-toolbar,.sg-filterbar,.sg-actionbar,.sg-modal-header,.sg-drawer-header,.sg-modal-head,.sg-drawer-head,.sg-modal__head,.sg-drawer__head,.sg-modal-body,.sg-drawer-body,.sg-modal__body,.sg-drawer__body,.sg-modal-footer,.sg-drawer-footer,.sg-modal__foot,.sg-drawer__foot{padding-left:14px;padding-right:14px;}
  .sg-toolbar-main,.sg-filterbar-main,.sg-toolbar-actions,.sg-filterbar-actions{flex-basis:100%;width:100%;justify-content:flex-start;}
  .sg-form-row > .span-2,.sg-form-row > .span-3,.sg-form-row > .span-4,.sg-form-row > .span-5,.sg-form-row > .span-6,.sg-form-row > .span-7,.sg-form-row > .span-8,.sg-form-row > .span-9,.sg-form-row > .span-10,.sg-form-row > .span-11{grid-column:span 12;}
}


/* Phase 2 — dialog / filter / timeline canonicals */
dialog.sg-dialog{
  border:1px solid var(--sg-border);border-radius:16px;padding:0;background:var(--sg-surface);color:var(--sg-text);
  width:min(var(--sg-dialog-max-w,720px), calc(100vw - 28px));box-shadow:var(--sg-shadow-md);
}
dialog.sg-dialog::backdrop{background:var(--sg-overlay-strong);backdrop-filter:blur(2px);}
dialog.sg-dialog .sg-dialog-b{max-height:min(70vh,720px);overflow:auto;}
.sg-dialog-form{display:flex;flex-direction:column;min-height:0;}
.sg-dialog-h{display:flex;gap:12px;align-items:center;padding:14px;border-bottom:1px solid var(--sg-divider);}
.sg-dialog-ico{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--sg-primary-soft);color:var(--sg-primary);flex:0 0 auto;}
.sg-dialog-t{font-weight:900;font-size:16px;line-height:1.2;}
.sg-dialog-x{margin-left:auto;border:0;background:transparent;color:var(--sg-muted);width:36px;height:36px;border-radius:12px;cursor:pointer;}
.sg-dialog-x:hover{background:var(--sg-overlay-soft);}
html.theme-dark .sg-dialog-x:hover{background:var(--sg-overlay-soft-2);}
.sg-dialog-b{padding:14px;}
dialog.sg-dialog .sg-dialog-b .sg-alert{margin-top:12px;}
dialog.sg-dialog .sg-dialog-b .sg-alert:first-child{margin-top:0;}
.sg-dialog-f{display:flex;gap:10px;justify-content:flex-end;padding:14px;border-top:1px solid var(--sg-divider);}
dialog.sg-dialog-danger{border-color:var(--sg-danger);}
dialog.sg-dialog-danger .sg-dialog-ico{background:var(--sg-danger-soft);color:var(--sg-danger);}
.sg-input-ico>i{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--sg-muted);pointer-events:none;z-index:1;}
.sg-input-ico .sg-input,.sg-input-ico .sg-select{padding-left:40px;}
.sg-input-ico .sg-custom-select__trigger{padding-left:40px;}
.sg-filterbar--soft{background:color-mix(in srgb,var(--sg-surface) 84%,var(--sg-primary-soft));}
.sg-empty,.sg-empty-state{padding:24px;text-align:center;border:1px dashed var(--sg-border);background:var(--sg-surface-2);border-radius:16px;color:var(--sg-muted);}
.sg-timeline{display:flex;flex-direction:column;gap:12px;}
.sg-timeline__item{display:grid;grid-template-columns:24px 1fr;gap:12px;}
.sg-timeline__dot{width:12px;height:12px;border-radius:999px;background:var(--sg-primary);margin-top:6px;box-shadow:0 0 0 4px color-mix(in srgb,var(--sg-primary) 14%,transparent);}
.sg-timeline__body{display:grid;gap:4px;min-width:0;}
.sg-badge--ok{background:var(--sg-success-soft);color:var(--sg-success);}
.sg-badge--warn{background:var(--sg-warning-soft);color:var(--sg-warning);}
.sg-badge--danger{background:var(--sg-danger-soft);color:var(--sg-danger);}
.sg-badge--info{background:var(--sg-info-soft);color:var(--sg-info);}


:root{
  --sg-suggest-surface:linear-gradient(180deg,color-mix(in srgb,var(--sg-surface) 98%, var(--sg-text) 2%),color-mix(in srgb,var(--sg-surface) 100%, transparent));
  --sg-suggest-border:color-mix(in srgb,var(--sg-border) 84%, var(--sg-primary) 16%);
  --sg-suggest-shadow:0 22px 44px color-mix(in srgb,var(--sg-text) 18%, transparent);
  --sg-suggest-item-hover:color-mix(in srgb,var(--sg-primary) 12%, var(--sg-surface));
}
html.theme-light,html[data-theme="light"],.theme-light{
  --sg-suggest-surface:linear-gradient(180deg,color-mix(in srgb,var(--sg-surface) 100%, white 0%),color-mix(in srgb,var(--sg-surface) 99%, var(--sg-primary) 1%));
  --sg-suggest-border:color-mix(in srgb,var(--sg-border) 88%, var(--sg-primary) 12%);
  --sg-suggest-shadow:0 18px 36px color-mix(in srgb,var(--sg-text) 10%, transparent);
}
:where(.sg-dropdown__list,.sg-catalog-ac-menu,.sg-booth-ac-menu,.sg-gifts-ac-menu,.sg-prereg-autocomplete-menu,.sgmg-ac-menu,.sg-settle-picker-list){border-radius:18px;border:1px solid var(--sg-suggest-border);background:var(--sg-suggest-surface);box-shadow:var(--sg-suggest-shadow);backdrop-filter:blur(10px);padding:8px;}
:where(.sg-dropdown__list,.sg-catalog-ac-menu,.sg-booth-ac-menu,.sg-gifts-ac-menu,.sg-prereg-autocomplete-menu,.sgmg-ac-menu,.sg-settle-picker-list) :where(.sg-dropdown__item,.sg-catalog-ac-item,.sg-booth-ac-item,.sg-gifts-ac-item,.sg-prereg-ac-item,.sgmg-ac-item,.sg-settle-picker-item,[data-role="event-picker-item"]){display:flex;align-items:flex-start;justify-content:space-between;gap:12px;width:100%;text-align:left;padding:12px 14px;border-radius:14px;border:0;background:transparent;color:inherit;cursor:pointer;transition:background-color .18s ease,color .18s ease;}
:where(.sg-dropdown__list,.sg-catalog-ac-menu,.sg-booth-ac-menu,.sg-gifts-ac-menu,.sg-prereg-autocomplete-menu,.sgmg-ac-menu,.sg-settle-picker-list) :where(.sg-dropdown__item,.sg-catalog-ac-item,.sg-booth-ac-item,.sg-gifts-ac-item,.sg-prereg-ac-item,.sgmg-ac-item,.sg-settle-picker-item,[data-role="event-picker-item"]):hover,
:where(.sg-dropdown__list,.sg-catalog-ac-menu,.sg-booth-ac-menu,.sg-gifts-ac-menu,.sg-prereg-autocomplete-menu,.sgmg-ac-menu,.sg-settle-picker-list) :where(.sg-dropdown__item,.sg-catalog-ac-item,.sg-booth-ac-item,.sg-gifts-ac-item,.sg-prereg-ac-item,.sgmg-ac-item,.sg-settle-picker-item,[data-role="event-picker-item"]).is-active{background:var(--sg-suggest-item-hover);}
:where(.sg-dropdown__list,.sg-catalog-ac-menu,.sg-booth-ac-menu,.sg-gifts-ac-menu,.sg-prereg-autocomplete-menu,.sgmg-ac-menu,.sg-settle-picker-list) :where(.sg-dropdown__item,.sg-catalog-ac-item,.sg-booth-ac-item,.sg-gifts-ac-item,.sg-prereg-ac-item,.sgmg-ac-item,.sg-settle-picker-item,[data-role="event-picker-item"]) + :where(.sg-dropdown__item,.sg-catalog-ac-item,.sg-booth-ac-item,.sg-gifts-ac-item,.sg-prereg-ac-item,.sgmg-ac-item,.sg-settle-picker-item,[data-role="event-picker-item"]){margin-top:4px;}
:where(.sg-dropdown__list,.sg-catalog-ac-menu,.sg-booth-ac-menu,.sg-gifts-ac-menu,.sg-prereg-autocomplete-menu,.sgmg-ac-menu,.sg-settle-picker-list) :where(.sg-dropdown__meta,.sg-catalog-ac-sub,.sg-booth-ac-sub,.sg-gifts-ac-sub,.sg-prereg-ac-sub,.sg-prereg-autocomplete-meta,.sgmg-ac-sub,.sg-settle-note){display:block;margin-top:4px;font-size:12px;line-height:1.5;color:var(--sg-muted);}
:where(.sg-dropdown__list,.sg-catalog-ac-menu,.sg-booth-ac-menu,.sg-gifts-ac-menu,.sg-prereg-autocomplete-menu,.sgmg-ac-menu,.sg-settle-picker-list) :where(.sg-dropdown__name,.sg-catalog-ac-name,.sg-booth-ac-name,.sg-gifts-ac-name,.sg-prereg-ac-name,.sgmg-ac-name){display:block;font-weight:700;line-height:1.45;}
:where(.sg-dropdown__list,.sg-catalog-ac-menu,.sg-booth-ac-menu,.sg-gifts-ac-menu,.sg-prereg-autocomplete-menu,.sgmg-ac-menu,.sg-settle-picker-list) :where(.sg-dropdown__empty,.sg-catalog-ac-empty,.sg-booth-ac-empty,.sg-gifts-ac-empty,.sg-prereg-ac-empty,.sg-prereg-autocomplete-empty,.sgmg-ac-empty){display:block;padding:12px 14px;border-radius:14px;color:var(--sg-muted);background:color-mix(in srgb,var(--sg-surface) 97%, var(--sg-text) 3%);}


/* Autocomplete panels: always float above sticky table heads */
:where(.sg-dropdown,.sg-catalog-ac,.sg-booth-ac,.sg-gifts-autocomplete,.sg-prereg-autocomplete,.sgmg-autocomplete,.sg-settle-picker){position:relative;overflow:visible;isolation:isolate;}
:where(.sg-dropdown.is-open,.sg-catalog-ac.is-open,.sg-booth-ac.is-open,.sg-gifts-autocomplete.is-open,.sg-prereg-autocomplete.is-open,.sgmg-autocomplete.is-open,.sg-settle-picker.is-open,.sg-settle-picker.open){z-index:120;}
:where(.sg-dropdown__list,.sg-catalog-ac-menu,.sg-booth-ac-menu,.sg-gifts-ac-menu,.sg-prereg-autocomplete-menu,.sgmg-ac-menu,.sg-settle-picker-list){z-index:120 !important;}
:where(.sg-custom-select){position:relative;min-width:0;}
:where(.sg-custom-select__source){position:absolute!important;inline-size:1px!important;block-size:1px!important;margin:-1px!important;padding:0!important;border:0!important;clip-path:inset(50%)!important;overflow:hidden!important;white-space:nowrap!important;opacity:0!important;pointer-events:none!important;}
:where(.sg-custom-select__trigger){display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:44px;padding:10px 12px;border:1px solid var(--sg-border);border-radius:14px;background:var(--sg-surface);color:var(--sg-text);cursor:pointer;text-align:left;transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease,color .18s ease;}
:where(.sg-custom-select__trigger:hover){border-color:var(--sg-border-strong);}
:where(.sg-custom-select.is-open .sg-custom-select__trigger,.sg-custom-select__trigger:focus-visible){outline:none;border-color:var(--sg-primary);box-shadow:0 0 0 4px color-mix(in srgb,var(--sg-primary) 18%,transparent);}
:where(.sg-custom-select__trigger.is-placeholder){color:var(--sg-muted);}
:where(.sg-custom-select__value){display:flex;flex-direction:column;gap:2px;min-width:0;flex:1 1 auto;}
:where(.sg-custom-select__label){display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700;line-height:1.45;}
:where(.sg-custom-select__meta){display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:2px;font-size:12px;line-height:1.45;color:var(--sg-muted);}
:where(.sg-custom-select__caret){flex:0 0 auto;color:var(--sg-muted);font-size:12px;transition:transform .18s ease,color .18s ease;}
:where(.sg-custom-select.is-open .sg-custom-select__caret){transform:rotate(180deg);color:var(--sg-primary);}
:where(.sg-custom-select.is-disabled .sg-custom-select__trigger){opacity:.66;cursor:not-allowed;background:var(--sg-surface-2);}
:where(.sg-custom-select.is-sidebar .sg-custom-select__trigger){background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.10);color:var(--sg-side-text);}
html.theme-light :where(.sg-custom-select.is-sidebar .sg-custom-select__trigger),html[data-theme='light'] :where(.sg-custom-select.is-sidebar .sg-custom-select__trigger){background:color-mix(in srgb, var(--sg-sidebar-surface) 94%, transparent);border-color:var(--sg-sidebar-button-border);color:var(--sg-side-text);}
:where(.sg-table,.sg-table-sticky,.sg-table-wrap){position:relative;}
:where(.sg-table thead th,.sg-table-sticky thead th){z-index:6;}

.sg-dialog-backdrop{position:fixed;inset:0;z-index:var(--sg-z-modal,110);display:grid;place-items:center;padding:16px;background:var(--sg-overlay-strong);backdrop-filter:blur(3px);}
.sg-dialog-backdrop .sg-dialog.sg-confirm-dialog{width:min(560px,calc(100vw - 24px));border:1px solid var(--sg-border);border-radius:18px;background:var(--sg-surface);box-shadow:var(--sg-shadow-lg);overflow:hidden;}
.sg-dialog-backdrop .sg-dialog.sg-confirm-dialog .sg-dialog-t{display:flex;align-items:center;gap:10px;}
.sg-dialog-backdrop .sg-dialog.sg-confirm-dialog .sg-icon-btn,.sg-dialog-backdrop .sg-dialog.sg-confirm-dialog .sg-dialog-x{border:0;background:transparent;color:var(--sg-muted);width:36px;height:36px;border-radius:12px;cursor:pointer;}
.sg-dialog-backdrop .sg-dialog.sg-confirm-dialog .sg-icon-btn:hover,.sg-dialog-backdrop .sg-dialog.sg-confirm-dialog .sg-dialog-x:hover{background:var(--sg-overlay-soft);}

:where(.sg-custom-select){z-index:2;}
:where(.sg-custom-select.is-open){z-index:130;}
:where(.sg-card,.sg-panel,.sg-card-body,.sg-card__body,.sg-panel-b) > :where(.sg-dropdown,.sg-custom-select){position:relative;}