/* ENGL251 Workplace Success: shared LIU course-portal skin for the interactive module. */
:root { --paper:#fff; --paper-2:#f8fafc; --panel:#fff; --panel-border:#d9e0e8; --ink:#182433; --muted:#5b6675; --accent:#b58a24; --accent-2:#082b5c; --accent-3:#b58a24; --rule:rgb(8 43 92 / 14%); --table-head:#eaf0f6; --shadow:0 12px 28px rgb(8 43 92 / 12%); --max:1180px; }
body[data-page="workplace"] { background:var(--bg); color:var(--text); font-family:var(--sans); }
.workplace-breadcrumbs { width:min(calc(100% - 2rem),var(--container)); margin:0 auto; padding:1rem 0 0; color:var(--muted); font-size:.9rem; }
.workplace-breadcrumbs a { color:var(--navy); }
body[data-page="workplace"] > .topbar { position:relative; top:auto; width:min(calc(100% - 2rem),var(--container)); margin:1.5rem auto 1rem; padding:.85rem 1rem; border:1px solid var(--line); border-top:3px solid var(--gold); border-radius:var(--radius); background:var(--surface); box-shadow:var(--shadow-sm); }
body[data-page="workplace"] .brand a { color:var(--navy); font-family:var(--serif); } body[data-page="workplace"] .brand small { color:var(--muted); }
body[data-page="workplace"] .toggle-btn,body[data-page="workplace"] .btn { border-radius:6px; background:var(--navy); box-shadow:none; }
body[data-page="workplace"] .toggle-btn.secondary,body[data-page="workplace"] .btn.secondary { border-color:#9aaabe; background:var(--white); color:var(--navy); }
body[data-page="workplace"] .toggle-btn:hover,body[data-page="workplace"] .btn:hover { background:var(--navy-2); filter:none; }
/* Keep the portal navigation identical to every other public page. */
body[data-page="workplace"] .main-nav .nav-list { display:flex; gap:0; padding:0; margin:0; }
body[data-page="workplace"] .main-nav .nav-list li { margin:0; }
body[data-page="workplace"] .main-nav .nav-list a { display:block; padding:.92rem .72rem; border-radius:0; background:transparent; color:var(--white); font-size:.9rem; line-height:1.2; }
body[data-page="workplace"] .main-nav .nav-list a:hover,body[data-page="workplace"] .main-nav .nav-list a[aria-current="page"] { border-bottom-color:var(--gold); background:#0e3970; color:var(--white); }
body[data-page="workplace"] .app { width:min(calc(100% - 2rem),var(--container)); gap:1.4rem; padding:0 0 3.5rem; grid-template-columns:17.5rem minmax(0,1fr); }
body[data-page="workplace"] .sidebar { top:1rem; max-height:calc(100vh - 2rem); overflow:hidden; }
body[data-page="workplace"] .brand-card,body[data-page="workplace"] .progress-wrap,body[data-page="workplace"] .sidebar nav,body[data-page="workplace"] .sidebar-actions { border-color:var(--line); border-radius:var(--radius); background:var(--surface); box-shadow:var(--shadow-sm); }
body[data-page="workplace"] .brand-card,body[data-page="workplace"] .progress-wrap,body[data-page="workplace"] .sidebar-actions { flex:0 0 auto; }
body[data-page="workplace"] .sidebar nav { flex:1 1 auto; min-height:0; overflow-y:auto; }
body[data-page="workplace"] .brand-card::after { background:rgb(181 138 36 / 12%); }
body[data-page="workplace"] .kicker,body[data-page="workplace"] .eyebrow,body[data-page="workplace"] .nav-title,body[data-page="workplace"] .tag { color:var(--gold); font-family:var(--sans); } body[data-page="workplace"] .dot { background:var(--gold); }
body[data-page="workplace"] .brand-card h1,body[data-page="workplace"] .brand-card p,body[data-page="workplace"] .tiny-note,body[data-page="workplace"] .sidebar-note,body[data-page="workplace"] .progress-top,body[data-page="workplace"] .nav-title,body[data-page="workplace"] .sidebar .nav-list a { color:var(--text); }
body[data-page="workplace"] .sidebar .nav-list { display:grid; gap:.2rem; margin:0; padding:0; list-style:none; }
body[data-page="workplace"] .sidebar .nav-list li { margin:0; }
body[data-page="workplace"] .sidebar .nav-list a { display:block; padding:.55rem .65rem; border-radius:6px; font-size:.9rem; }
body[data-page="workplace"] .sidebar .nav-list a:hover,body[data-page="workplace"] .sidebar .nav-list a:focus,body[data-page="workplace"] .sidebar .nav-list a.active { color:var(--navy); background:#eef3f8; }
body[data-page="workplace"] .progress-track { border-color:#cbd7e4; background:#e6edf5; } body[data-page="workplace"] .progress-bar { background:linear-gradient(90deg,var(--gold),#d1a840); }
body[data-page="workplace"] .content-inner { border-color:var(--line); border-radius:var(--radius); background:var(--surface); box-shadow:var(--shadow-sm); }
body[data-page="workplace"] .content .module { padding:0; }
body[data-page="workplace"] .hero { padding:clamp(2rem,4.5vw,3.8rem); background:linear-gradient(112deg,#071e42 0%,#082b5c 62%,#184b85 100%); border-radius:var(--radius) var(--radius) 0 0; }
body[data-page="workplace"] .hero h2,body[data-page="workplace"] .hero h1 { max-width:20ch; color:var(--white); font-family:var(--serif); font-size:clamp(2.1rem,4vw,3.45rem); text-shadow:none; } body[data-page="workplace"] .pill { border-color:rgb(255 255 255 / 24%); }
body[data-page="workplace"] .module { border-color:var(--line); border-radius:var(--radius); box-shadow:var(--shadow-sm); }
body[data-page="workplace"] .module:not(:last-child) { margin-bottom:1.4rem; }
body[data-page="workplace"] .section-header { border-bottom-color:var(--line); background:#f7f9fb; }
body[data-page="workplace"] .section-header h2,body[data-page="workplace"] h2 { color:var(--navy); font-family:var(--serif); } body[data-page="workplace"] h3 { color:var(--navy); font-family:var(--serif); } body[data-page="workplace"] .lead { color:var(--muted); }
body[data-page="workplace"] .tag { background:var(--gold-light); color:#5a4006; }
body[data-page="workplace"] .card,body[data-page="workplace"] .numbered-card,body[data-page="workplace"] .callout,body[data-page="workplace"] .quote-box,body[data-page="workplace"] .reflection-box,body[data-page="workplace"] .checklist,body[data-page="workplace"] .objectives,body[data-page="workplace"] .comparison,body[data-page="workplace"] .action-row { height:auto; display:block; padding:18px; border-color:var(--line); border-radius:8px; background:#fff; box-shadow:none; }
body[data-page="workplace"] .callout { border-left-color:var(--gold); background:#fffaf0; } body[data-page="workplace"] .quote-box { border-left-color:var(--navy); background:#f0f5fa; }
body[data-page="workplace"] input,body[data-page="workplace"] textarea { border-color:#8796a8; border-radius:6px; }
@media print { body[data-page="workplace"] [data-site-header],body[data-page="workplace"] [data-site-footer],body[data-page="workplace"] .workplace-breadcrumbs { display:none !important; } }
@media (max-width:980px) { body[data-page="workplace"] .main-nav .nav-list { display:none; } body[data-page="workplace"] .main-nav .nav-list.is-open { display:flex; } body[data-page="workplace"] .app { grid-template-columns:1fr; } body[data-page="workplace"] .sidebar { position:static; max-height:none; overflow:visible; } body[data-page="workplace"] .sidebar nav { max-height:18rem; overflow:auto; } }
@media (max-width:600px) { body[data-page="workplace"] > .topbar { width:min(calc(100% - 1rem),var(--container)); margin-top:1rem; } body[data-page="workplace"] .app { width:min(calc(100% - 1rem),var(--container)); } body[data-page="workplace"] .topbar { grid-template-columns:1fr; } body[data-page="workplace"] .controls { justify-content:flex-start; } }