@import url('../../../berkah/css/components/workspace-layout.css');

:root{
  --pos09-bg:#fff7fe;
  --pos09-panel:#ffffff;
  --pos09-text:#4a044e;
  --pos09-muted:#8a3a86;
  --pos09-line:#f3d6fb;
  --pos09-primary:#c026d3;
  --pos09-accent:#f472b6;
  --pos09-soft:#fae8ff;
  --pos09-tint:#fdf4ff;
  --pos09-dark:#86198f;
  --pos09-shadow:0 18px 48px rgba(134,25,143,.10);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:Arial,Helvetica,sans-serif;background:linear-gradient(180deg,#fffaff 0%,#fdf4ff 100%);color:var(--pos09-text)}
a{text-decoration:none;color:inherit}
.pos09-dashboard{
  --theme-primary:var(--pos09-primary);
  --theme-accent:var(--pos09-accent);
  --theme-soft:var(--pos09-soft);
  --theme-tint:var(--pos09-tint);
  --theme-dark:var(--pos09-dark);
  max-width:1280px;
  margin:0 auto;
  padding:32px 24px 56px;
}
.pos09-dashboard--pos-09-sunset,.pos09-dashboard--pos-sunset{--theme-primary:#d97706;--theme-accent:#ef4444;--theme-soft:#ffedd5;--theme-tint:#fff7ed;--theme-dark:#9a3412;}
.pos09-dashboard--pos-09-berry,.pos09-dashboard--pos09-berry,.pos09-dashboard--pos-09-fuchsia,.pos09-dashboard--pos-fuchsia{--theme-primary:#be185d;--theme-accent:#fb7185;--theme-soft:#fce7f3;--theme-tint:#fff1f2;--theme-dark:#9d174d;}
.pos09-dashboard--pos-09-indigo,.pos09-dashboard--pos-indigo{--theme-primary:#4338ca;--theme-accent:#818cf8;--theme-soft:#e0e7ff;--theme-tint:#eef2ff;--theme-dark:#312e81;}

.pos09-hero{display:grid;grid-template-columns:1.18fr .82fr;gap:24px;align-items:stretch;border-radius:30px;padding:34px;background:linear-gradient(135deg,var(--theme-dark),var(--theme-primary),var(--theme-accent));color:#fff;box-shadow:var(--pos09-shadow)}
.pos09-hero--compact{padding:28px}
.pos09-eyebrow,.pos09-section-head__eyebrow{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.pos09-hero h1{font-size:44px;line-height:1.08;margin:10px 0 12px}
.pos09-hero__lead{font-size:18px;line-height:1.7;max-width:760px;margin:0}
.pos09-hero__badges{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.pos09-badge{display:inline-flex;align-items:center;height:38px;padding:0 14px;border-radius:999px;background:rgba(255,255,255,.2);font-weight:700}
.pos09-badge--soft{background:rgba(255,255,255,.12)}
.pos09-focus-card{background:rgba(255,255,255,.96);color:var(--pos09-text);border-radius:22px;padding:22px;height:100%;box-shadow:0 12px 36px rgba(154,52,18,.18)}
.pos09-focus-card__label{font-size:12px;text-transform:uppercase;letter-spacing:.14em;color:var(--pos09-muted);font-weight:700}
.pos09-focus-card__title{font-size:28px;line-height:1.15;font-weight:800;margin:10px 0}
.pos09-focus-card p{color:var(--pos09-muted);line-height:1.7;margin:0}

.pos09-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:24px}
.pos09-kpi-card,.pos09-highlight-card{background:var(--pos09-panel);border:1px solid var(--pos09-line);border-radius:22px;padding:20px;box-shadow:var(--pos09-shadow)}
.pos09-kpi-card{border-left:5px solid var(--theme-primary)}
.pos09-kpi-card__label,.pos09-highlight-card__label{font-size:12px;text-transform:uppercase;letter-spacing:.14em;color:var(--pos09-muted);font-weight:700}
.pos09-kpi-card__value{font-size:36px;font-weight:800;line-height:1.1;margin:8px 0 10px;color:var(--theme-primary)}
.pos09-kpi-card__hint,.pos09-highlight-card__meta{color:var(--pos09-muted);line-height:1.6}
.pos09-highlight-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:18px}
.pos09-highlight-card__value{font-size:20px;font-weight:800;line-height:1.35;margin:8px 0 10px;color:var(--pos09-text)}

.pos09-panel{background:var(--pos09-panel);border:1px solid var(--pos09-line);border-radius:24px;padding:22px;box-shadow:var(--pos09-shadow)}
.pos09-panel--helper{background:linear-gradient(180deg,#fffdfa 0%,#fff7f2 100%)}
.pos09-section-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-end;margin-bottom:16px}
.pos09-section-head--stacked{align-items:flex-start}
.pos09-section-head h2{font-size:28px;margin:8px 0 0}
.pos09-section-head__meta{font-size:14px;color:var(--pos09-muted)}

.pos09-filter-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.pos09-field{display:grid;gap:8px}
.pos09-field--wide{grid-column:1/-1}
.pos09-field span{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--pos09-muted)}
.pos09-field input,.pos09-field select{height:48px;border:1px solid #ecd1c3;border-radius:16px;padding:0 14px;font-size:15px;background:#fff;outline:none}
.pos09-field input:focus,.pos09-field select:focus{border-color:var(--theme-primary);box-shadow:0 0 0 4px color-mix(in srgb, var(--theme-primary) 16%, white)}
.pos09-filter-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:16px}
.pos09-btn{height:44px;padding:0 18px;border-radius:14px;border:1px solid transparent;font-weight:700;cursor:pointer}
.pos09-btn--primary{background:linear-gradient(135deg,var(--theme-primary),var(--theme-accent));color:#fff}
.pos09-btn--ghost{background:#fff;color:var(--theme-primary);border-color:#ecd1c3}

.pos09-table-wrap{overflow:auto;border:1px solid var(--pos09-line);border-radius:18px}
.pos09-table{width:100%;border-collapse:collapse;min-width:820px}
.pos09-table thead th{background:var(--theme-primary);color:#fff;font-size:13px;text-align:left;padding:14px 16px;white-space:nowrap}
.pos09-table tbody td{padding:14px 16px;border-bottom:1px solid #f6e5dc;font-size:14px}
.pos09-table tbody tr:hover{background:#fff9f5}
.pos09-status{display:inline-flex;align-items:center;height:32px;padding:0 12px;border-radius:999px;background:var(--theme-tint);color:var(--theme-primary);font-weight:700;font-size:12px}
.pos09-link-action{font-weight:700;color:var(--theme-primary)}
.pos09-empty-state{margin-top:16px;padding:16px 18px;border-radius:18px;background:#fff9f5;border:1px dashed #ecd1c3}
.pos09-empty-state__title{font-weight:800;margin-bottom:6px}

.pos09-focus-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.pos09-focus-panel__body{color:var(--pos09-muted);line-height:1.7;margin:0 0 14px}
.pos09-bullet-list{display:grid;gap:10px}
.pos09-bullet-list--soft .pos09-bullet-list__item{color:var(--pos09-muted)}
.pos09-bullet-list__item{display:grid;grid-template-columns:auto 1fr;gap:10px;color:var(--pos09-text);line-height:1.6}
.pos09-bullet-list__item span{font-weight:800;color:var(--theme-primary)}

.pos09-menu-grid,.pos09-shortcuts,.pos09-module-links{display:grid;gap:14px}
.pos09-menu-card,.pos09-shortcut,.pos09-module-link{display:grid;gap:8px;padding:18px 18px;border:1px solid #f2dacd;border-radius:20px;background:#fffdfa;transition:all .18s ease;box-shadow:0 8px 22px rgba(154,52,18,.04)}
.pos09-menu-card:hover,.pos09-shortcut:hover,.pos09-module-link:hover{border-color:color-mix(in srgb, var(--theme-primary) 28%, #ef4444);background:#fff7f2;transform:translateY(-1px);box-shadow:0 14px 30px rgba(154,52,18,.08)}
.pos09-menu-card.is-active,.pos09-shortcut.is-active,.pos09-module-link.is-active{border-color:var(--theme-primary);background:var(--theme-tint)}
.pos09-menu-card__title,.pos09-shortcut__title{font-weight:800;color:var(--pos09-text);font-size:17px;line-height:1.3}
.pos09-menu-card__meta,.pos09-shortcut__meta{font-size:13px;color:var(--pos09-muted);line-height:1.5}
.pos09-module-link{font-weight:800;color:var(--pos09-text);line-height:1.5}
.pos09-module-link--home{background:var(--theme-tint);color:var(--theme-primary)}

.pos09-workspace{display:grid;grid-template-columns:1.08fr .92fr;gap:10px;margin-top:24px}
.pos09-workspace--single{grid-template-columns:1fr .8fr}
.pos09-workspace__main,.pos09-workspace__side{display:grid;gap:14px}
.pos09-workspace__side{position:sticky;top:20px;align-self:start;width:100%}
.pos09-workspace__side>.pos09-panel{width:100%}

@media (max-width:1100px){
  .pos09-hero,.pos09-kpi-grid,.pos09-highlight-grid,.pos09-focus-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pos09-workspace,.pos09-workspace--single{grid-template-columns:1fr;gap:16px}
  .pos09-workspace__side{position:static}
}
@media (max-width:768px){
  .pos09-dashboard{padding:16px}
  .pos09-hero{padding:24px;border-radius:22px;grid-template-columns:1fr}
  .pos09-hero h1,.pos09-section-head h2{font-size:32px}
  .pos09-kpi-grid,.pos09-highlight-grid,.pos09-filter-grid,.pos09-focus-grid{grid-template-columns:1fr}
  .pos09-field--wide{grid-column:auto}
}