/* SDA Church Program Portal V10 Ultra-Elite — Build 1
   Additive presentation layer. Existing application logic remains authoritative. */
:root{
  --v10-navy-950:#061b31;--v10-navy-900:#082742;--v10-navy-850:#0a3152;--v10-navy-800:#0b3a62;
  --v10-blue-700:#0b63b6;--v10-blue-600:#0a72d8;--v10-blue-500:#1285ee;--v10-blue-100:#e9f4ff;
  --v10-gold-600:#be8700;--v10-gold-500:#dfa900;--v10-gold-300:#f2cf63;
  --v10-ink:#0a1f36;--v10-muted:#56708a;--v10-line:#c9d9e8;--v10-surface:#ffffff;--v10-bg:#eef5fb;
  --v10-danger:#d83b3b;--v10-success:#22a35a;--v10-shadow:0 10px 28px rgba(4,28,53,.12);
  --v10-radius:12px;--v10-radius-sm:8px;--v10-focus:0 0 0 3px rgba(18,133,238,.28);
}
html,body{background:var(--v10-bg)!important;color:var(--v10-ink)!important;font-family:"Segoe UI Variable","Segoe UI",Arial,sans-serif!important;}
body{letter-spacing:.002em!important;}
body *{box-sizing:border-box}
body button,body input,body select,body textarea{font:inherit}
body button{transition:background .14s ease,border-color .14s ease,transform .12s ease,box-shadow .14s ease}
body button:hover:not(:disabled){transform:translateY(-1px)}
body button:focus-visible,body input:focus-visible,body select:focus-visible,body textarea:focus-visible{outline:none!important;box-shadow:var(--v10-focus)!important}

/* Global shell */
#portalView{background:linear-gradient(135deg,#edf5fb 0%,#f9fcff 52%,#eef5fb 100%)!important;}
#portalView>header,.portal-header,.app-header{background:linear-gradient(100deg,var(--v10-navy-950),var(--v10-navy-800))!important;color:#fff!important;border-bottom:1px solid rgba(242,207,99,.68)!important;box-shadow:0 4px 18px rgba(0,20,40,.18)!important;}
#portalView>nav,.portal-nav,.sidebar{background:linear-gradient(180deg,var(--v10-navy-900),#061d33 72%,#041526)!important;color:#eaf4ff!important;border-right:1px solid rgba(242,207,99,.45)!important;box-shadow:5px 0 22px rgba(0,16,31,.12)!important;}
#portalView>nav button,.portal-nav button,.sidebar button{color:#dcecff!important;background:transparent!important;border:1px solid transparent!important;border-radius:8px!important;margin:2px 8px!important;min-height:42px!important;text-align:left!important;}
#portalView>nav button:hover,.portal-nav button:hover,.sidebar button:hover{background:rgba(255,255,255,.075)!important;border-color:rgba(255,255,255,.08)!important;}
#portalView>nav button.is-active,#portalView>nav button[aria-current="page"],.portal-nav button.is-active,.sidebar button.is-active{background:linear-gradient(90deg,#0b6bd0,#0c5da9)!important;color:#fff!important;border-color:#2b88df!important;box-shadow:inset 4px 0 0 var(--v10-gold-300),0 5px 14px rgba(0,33,65,.28)!important;}
main,.portal-main,.page-content{scrollbar-color:#8db3d5 transparent;scrollbar-width:thin}

/* Page titles and surfaces */
h1,h2,h3,.section-title{color:#092746!important;letter-spacing:-.018em!important}
h1{font-size:clamp(25px,2vw,34px)!important;font-weight:700!important}
h2{font-size:20px!important;font-weight:700!important}.muted,.subtle{color:var(--v10-muted)!important}
.card,.panel,.section,.surface,.v10-surface{background:rgba(255,255,255,.96)!important;border:1px solid #c9d9e8!important;border-radius:var(--v10-radius)!important;box-shadow:0 5px 18px rgba(8,45,78,.07)!important;}
input:not([type=checkbox]):not([type=radio]),select,textarea{background:#fff!important;color:#112f4d!important;border:1px solid #bfcfdd!important;border-radius:7px!important;min-height:38px!important;padding:7px 10px!important;box-shadow:inset 0 1px 2px rgba(5,31,55,.04)!important;}
input:hover,select:hover,textarea:hover{border-color:#83afd6!important}

/* Premium buttons */
button,.button,.btn{border-radius:8px!important;min-height:36px!important;border:1px solid #b7ccdf!important;background:#fff!important;color:#173b5d!important;font-weight:600!important;padding:7px 12px!important;}
button.primary,.btn-primary,.primary-action{background:linear-gradient(180deg,#0d79db,#0862b4)!important;color:#fff!important;border-color:#0860b0!important;box-shadow:0 4px 10px rgba(10,99,182,.22)!important;}
button.danger,.btn-danger{background:#fff2f2!important;color:var(--v10-danger)!important;border-color:#f0b9b9!important}

/* Program area: create a command-center feel on existing markup. */
#programs,#program-builder,#programBuilder,.program-builder{position:relative!important;}
#programs::before,#program-builder::before,#programBuilder::before,.program-builder::before{content:"V10 ULTRA-ELITE  •  PROGRAM BUILDER";display:block!important;margin:0 0 10px!important;padding:8px 12px!important;border-radius:8px!important;background:linear-gradient(90deg,var(--v10-navy-900),var(--v10-navy-800))!important;color:#fff!important;font-size:12px!important;font-weight:700!important;letter-spacing:.09em!important;border-bottom:2px solid var(--v10-gold-500)!important;}
.workflow-list,.program-items,.items-list{display:grid!important;gap:7px!important;}

/* V10 Program Item — compact premium operational row */
@media (min-width:981px){
.workflow-item.item-row{display:grid!important;grid-template-columns:40px 62px minmax(155px,1.4fr) minmax(120px,.9fr) minmax(160px,1.15fr) minmax(150px,1.1fr) 74px!important;grid-template-rows:52px 38px!important;gap:6px 10px!important;align-items:stretch!important;margin:6px 0!important;padding:8px 9px!important;background:linear-gradient(180deg,#fff,#f8fbfe)!important;border:1px solid #c7d8e7!important;border-left:4px solid #1682e7!important;border-radius:10px!important;box-shadow:0 3px 10px rgba(7,46,80,.055)!important;overflow:hidden!important;transition:border-color .14s ease,box-shadow .14s ease,transform .14s ease!important;}
.workflow-item.item-row:hover{border-color:#8ab6db!important;box-shadow:0 7px 18px rgba(7,46,80,.10)!important;transform:translateY(-1px)!important}
.workflow-item.item-row:focus-within{border-color:#1886e8!important;box-shadow:0 0 0 3px rgba(24,134,232,.11),0 8px 20px rgba(7,46,80,.10)!important}
.workflow-item>.workflow-seq{grid-column:1!important;grid-row:1/3!important;align-self:center!important;justify-self:center!important;width:30px!important;height:30px!important;display:grid!important;place-items:center!important;padding:0!important;border-radius:8px!important;background:linear-gradient(180deg,#eaf4fe,#ddeaf6)!important;border:1px solid #c9d9e8!important;color:#0b4f8b!important;font-weight:700!important;font-variant-numeric:tabular-nums!important}
.workflow-item>.workflow-required{grid-column:2!important;grid-row:1!important;align-self:center!important;}
.workflow-item>label:nth-of-type(2){grid-column:3!important;grid-row:1!important}.workflow-item>label:nth-of-type(3){grid-column:4!important;grid-row:1!important}.workflow-item>label:nth-of-type(4){grid-column:5!important;grid-row:1!important}.workflow-item>label:nth-of-type(5){grid-column:6!important;grid-row:1!important}.workflow-item>label:nth-of-type(6){grid-column:2/5!important;grid-row:2!important}
.workflow-item>.workflow-row-actions{display:contents!important}
.workflow-item>.workflow-row-actions>.item-up,.workflow-item>.workflow-row-actions>.item-down{grid-column:7!important;width:32px!important;min-width:32px!important;height:28px!important;min-height:28px!important;padding:0!important;justify-self:start!important;border-color:#bfd0df!important;background:#fff!important;color:#17476e!important;box-shadow:none!important}
.workflow-item>.workflow-row-actions>.item-up{grid-row:1!important;align-self:start!important}.workflow-item>.workflow-row-actions>.item-down{grid-row:1!important;align-self:end!important}
.workflow-item>.workflow-row-actions>.item-remove{grid-column:7!important;grid-row:2!important;justify-self:end!important;width:32px!important;min-width:32px!important;overflow:hidden!important;color:transparent!important;background:#fff2f2!important;border-color:#f2b8b8!important;padding:0!important}
.workflow-item>.workflow-row-actions>.item-remove::before{width:15px!important;height:15px!important;flex:0 0 15px!important;color:var(--v10-danger)!important}
.workflow-item>.workflow-row-actions>.item-scripture,.workflow-item>.workflow-row-actions>.item-hymn,.workflow-item>.workflow-row-actions>.item-worship-resource,.workflow-item>.workflow-row-actions>.v8-open-report,.workflow-item>.workflow-row-actions>.v82-read-report{grid-column:5/7!important;grid-row:2!important;justify-self:end!important;width:auto!important;max-width:240px!important;min-width:135px!important;background:#edf6ff!important;color:#0866bb!important;border-color:#afd3ef!important;box-shadow:none!important}
.workflow-item>.workflow-row-actions>button.hidden{display:none!important}
}

/* Contextual workflow buttons */
.workflow-item .item-scripture,.workflow-item .item-hymn,.workflow-item .item-worship-resource{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;font-weight:650!important}
.workflow-item .item-remove{display:inline-flex!important;align-items:center!important;justify-content:center!important}

/* Tables */
table,.table,.v83-table{border-collapse:separate!important;border-spacing:0!important;background:#fff!important;border:1px solid #c8d8e6!important;border-radius:10px!important;overflow:hidden!important}
th,.table th,.v83-table th{background:linear-gradient(180deg,#edf5fb,#e3eef7)!important;color:#123a5c!important;font-size:12px!important;text-transform:uppercase!important;letter-spacing:.035em!important;border-bottom:1px solid #c1d4e4!important;padding:9px 10px!important}
td,.table td,.v83-table td{border-bottom:1px solid #e2eaf1!important;padding:9px 10px!important}
tr:hover td{background:#f8fbfe!important}

/* Dashboard status cards */
.dashboard .card,.dashboard-card,.metric-card{position:relative!important;overflow:hidden!important;border-top:3px solid #1481e6!important}
.dashboard .card::after,.dashboard-card::after,.metric-card::after{content:"";position:absolute;right:-30px;top:-30px;width:90px;height:90px;border-radius:50%;background:radial-gradient(circle,rgba(18,133,238,.12),transparent 68%);pointer-events:none}

/* Worship picker */
.worship-resource-picker{background:linear-gradient(180deg,#fafdff,#f3f8fc)!important;border:1px solid #c7d9e8!important;border-radius:10px!important;padding:12px!important}
.worship-resource-picker>.hymn-picker-grid{gap:8px!important}.worship-resource-picker button{white-space:nowrap!important}

/* Personnel and reports */
#personnel .grid,#reports .grid,#administration .grid{gap:10px 12px!important}
#personnel,#reports,#administration{accent-color:#0a72d8!important}
.notice,.status{border-radius:8px!important;padding:9px 11px!important}.status.success,.notice.success{background:#ebf8f0!important;border:1px solid #a9dfbd!important;color:#17643a!important}.status.warning,.notice.warning{background:#fff8e4!important;border:1px solid #f0d58a!important;color:#76560b!important}

/* Scrollbar */
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#9cb9d0;border-radius:12px;border:2px solid transparent;background-clip:padding-box}::-webkit-scrollbar-track{background:transparent}

/* Responsive */
@media(max-width:980px){
.workflow-item.item-row{border-left:4px solid #1682e7!important;background:#fff!important;border-radius:10px!important;box-shadow:0 3px 12px rgba(7,46,80,.07)!important;overflow:visible!important}
.workflow-item>.workflow-row-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important}
}
@media(max-width:760px){h1{font-size:24px!important}button,.button,.btn{min-height:40px!important}.card,.panel,.section{border-radius:9px!important}}

/* Print keeps worship outputs clean and removes app chrome. */
@media print{#portalView>nav,.portal-nav,.sidebar,.app-header,.portal-header{display:none!important}body,#portalView{background:#fff!important}.card,.panel,.section{box-shadow:none!important;border-color:#bbb!important}}
/* ============================================================
   V10_AUTH_ACTIVATION_REPAIR_3
   Login activation authority
   ============================================================ */
#loginView {
    position: relative !important;
    isolation: isolate !important;
}
#loginView::before,
#loginView::after,
#loginView .row::before,
#loginView .row::after {
    pointer-events: none !important;
}
#loginView .row {
    position: relative !important;
    z-index: 10 !important;
}
#loginView label,
#loginView input,
#loginView select,
#loginView button,
#loginView #loginStatus {
    position: relative !important;
    z-index: 20 !important;
}
#loginView input,
#loginView select,
#loginView button {
    pointer-events: auto !important;
}
#loginBtn {
    cursor: pointer !important;
    touch-action: manipulation !important;
}

/* ============================================================
   APPROVED PORTAL-WIDE REDESIGN — BUILD 2
   Visual authority: supplied compact horizontal-navigation design.
   This final section intentionally overrides every older repair.
   ============================================================ */
:root{
  --approved-navy:#073461;--approved-navy-dark:#052747;--approved-blue:#0869c7;
  --approved-blue-soft:#eaf4fe;--approved-gold:#e5ad19;--approved-red:#e4313c;
  --approved-ink:#102b47;--approved-muted:#60758b;--approved-line:#c9dced;
  --approved-canvas:#f4f8fc;--approved-white:#fff;
}
html{font-size:14px!important;scroll-padding-top:54px!important;overflow-x:hidden!important}
body{padding-top:0!important;background:var(--approved-canvas)!important;font-size:14px!important;line-height:1.35!important;overflow-x:hidden!important}
body:has(#portalView:not(.hidden))>.appbar{display:none!important}
body:not(:has(#portalView:not(.hidden)))>.appbar{min-height:68px!important;padding:10px 24px!important}
body:not(:has(#portalView:not(.hidden)))>.wrap{padding-top:18px!important}
body:has(#portalView:not(.hidden))>.wrap{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}

/* Approved fixed, one-line application navigation. */
#portalView:not(.hidden){display:block!important;width:100%!important;min-height:100vh!important;padding:48px 10px 14px!important;background:var(--approved-canvas)!important}
#portalView>nav{
  position:fixed!important;inset:0 0 auto 0!important;width:100%!important;height:48px!important;
  max-height:48px!important;display:flex!important;align-items:center!important;gap:3px!important;
  padding:5px 12px!important;overflow:visible!important;z-index:1200!important;
  border:0!important;border-bottom:2px solid var(--approved-gold)!important;border-radius:0!important;
  background:linear-gradient(100deg,var(--approved-navy-dark),var(--approved-navy))!important;
  box-shadow:0 3px 12px rgba(5,39,71,.17)!important;
}
#portalView>nav button{
  position:relative!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;
  flex:0 0 auto!important;width:auto!important;min-width:0!important;min-height:32px!important;height:32px!important;
  margin:0!important;padding:4px 10px 4px 28px!important;border:1px solid transparent!important;border-radius:6px!important;
  background:transparent!important;color:#eaf5ff!important;box-shadow:none!important;font-size:12px!important;font-weight:500!important;
  line-height:1!important;text-align:center!important;white-space:nowrap!important;transform:none!important;
}
#portalView>nav button::before{content:"";position:absolute;left:9px;width:13px;height:13px;background:currentColor;opacity:.95;mask:center/contain no-repeat var(--nav-icon);-webkit-mask:center/contain no-repeat var(--nav-icon)}
#portalView>nav button[data-page="dashboard"]{--nav-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 13h8V3H3v10Zm0 8h8v-6H3v6Zm10 0h8V11h-8v10Zm0-18v6h8V3h-8Z'/%3E%3C/svg%3E")}
#portalView>nav button[data-page="assignments"]{--nav-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 11H7v2h2v-2Zm4 0h-2v2h2v-2Zm4 0h-2v2h2v-2Zm2-7h-1V2h-2v2H8V2H6v2H5a3 3 0 0 0-3 3v12a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3V7a3 3 0 0 0-3-3Zm1 15a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-9h16v9Z'/%3E%3C/svg%3E")}
#portalView>nav button[data-page="programs"]{--nav-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 3h16a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2Zm2 4v2h12V7H6Zm0 4v2h8v-2H6Zm0 4v2h10v-2H6Z'/%3E%3C/svg%3E")}
#portalView>nav button[data-page="personnel"]{--nav-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M16 11c1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3 1.34 3 3 3ZM8 11c1.66 0 3-1.34 3-3S9.66 5 8 5 5 6.34 5 8s1.34 3 3 3Zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5C15 14.17 10.33 13 8 13Zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5Z'/%3E%3C/svg%3E")}
#portalView>nav button[data-page="secretaryReports"]{--nav-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 3h14a2 2 0 0 1 2 2v16l-4-3-5 3-5-3-4 3V5a2 2 0 0 1 2-2Zm2 4v2h10V7H7Zm0 4v2h10v-2H7Z'/%3E%3C/svg%3E")}
#portalView>nav button[data-page="system"]{--nav-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19.4 13a7.8 7.8 0 0 0 .06-1 7.8 7.8 0 0 0-.06-1l2.11-1.65-2-3.46-2.49 1A8.1 8.1 0 0 0 15.3 6L15 3.35h-4L10.7 6a8.1 8.1 0 0 0-1.72.89l-2.49-1-2 3.46L6.6 11a7.8 7.8 0 0 0-.06 1c0 .34.02.67.06 1l-2.11 1.65 2 3.46 2.49-1A8.1 8.1 0 0 0 10.7 18l.3 2.65h4l.3-2.65a8.1 8.1 0 0 0 1.72-.89l2.49 1 2-3.46L19.4 13ZM13 15.5a3.5 3.5 0 1 1 0-7 3.5 3.5 0 0 1 0 7Z'/%3E%3C/svg%3E")}
#portalView>nav #logoutBtn{margin-left:auto!important;--nav-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 17v3H3V4h7v3h2V2H1v20h11v-5h-2Zm11-5-4-4v3H8v2h9v3l4-4Z'/%3E%3C/svg%3E")}
#portalView>nav button:hover{background:rgba(255,255,255,.10)!important;border-color:rgba(255,255,255,.15)!important;color:#fff!important}
#portalView>nav button.is-active,#portalView>nav button[aria-current="page"]{background:#fff!important;color:var(--approved-blue)!important;border-color:#fff!important;box-shadow:0 2px 7px rgba(0,0,0,.16)!important}

/* Compact, calm typography and surfaces throughout the software. */
#portalView>.page{width:100%!important;max-width:1500px!important;margin:10px auto 0!important;padding:0!important;min-width:0!important;background:transparent!important;border:0!important;box-shadow:none!important}
#portalView .card,#portalView .panel,#portalView .section{margin:0 0 9px!important;padding:12px!important;border:1px solid var(--approved-line)!important;border-radius:8px!important;background:#fff!important;box-shadow:0 2px 8px rgba(5,45,80,.05)!important}
#portalView h1,#portalView h2,#portalView h3,#portalView .section-title{margin:0 0 9px!important;color:var(--approved-ink)!important;font-weight:600!important;letter-spacing:-.01em!important}
#portalView h1{font-size:20px!important}#portalView h2{font-size:18px!important}#portalView h3{font-size:15px!important}
#portalView p,#portalView label,#portalView td,#portalView li{font-weight:400!important}
#portalView label{font-size:12px!important;color:var(--approved-ink)!important;gap:3px!important}
#portalView strong,#portalView b{font-weight:600!important}
#portalView .muted{color:var(--approved-muted)!important;font-size:12px!important}
#portalView input:not([type=checkbox]):not([type=radio]),#portalView select,#portalView textarea{min-height:31px!important;height:31px!important;padding:4px 8px!important;border:1px solid #bcd2e6!important;border-radius:5px!important;font-size:12px!important;font-weight:400!important;box-shadow:none!important}
#portalView textarea{height:auto!important;min-height:50px!important}
#portalView button{min-height:31px!important;height:31px!important;padding:4px 10px!important;border-radius:5px!important;font-size:12px!important;font-weight:500!important;box-shadow:none!important;transform:none!important}
#portalView button:not(.danger):not(.item-remove){background:#eef6fe!important;color:#0b4d87!important;border-color:#b8d4ec!important}
#portalView button:not(.danger):not(.item-remove):hover{background:#dceeff!important;border-color:#78afe0!important}
#portalView button.primary,#portalView #saveProgramBtn,#portalView #loginBtn{background:var(--approved-blue)!important;color:#fff!important;border-color:#0759a8!important}
#portalView .grid,#portalView .row{gap:8px 10px!important}
#portalView .notice{padding:7px 10px!important;font-size:12px!important;font-weight:400!important;line-height:1.35!important;border-radius:6px!important}
#portalView table,#portalView .table,#portalView .v83-table{font-size:12px!important;border-radius:7px!important}
#portalView th,#portalView td{padding:6px 8px!important;text-transform:none!important;letter-spacing:0!important}
#portalView th{font-weight:600!important}

/* Programs: approved compact editor and order-of-service treatment. */
#programs::before,#program-builder::before,#programBuilder::before,.program-builder::before{display:none!important;content:none!important}
#programs>.card:first-child{padding:10px!important}
#programs>.card:first-child>.grid{grid-template-columns:minmax(150px,.8fr) minmax(160px,.75fr) minmax(220px,1.5fr)!important;margin-bottom:7px!important}
#programWorkflowHint{margin:4px 0 9px!important;border-left:3px solid var(--approved-gold)!important;background:#fff8df!important;border-color:#efd17b!important;color:#3b4b58!important}
#programs h3{display:flex!important;align-items:center!important;gap:6px!important;margin:10px 0 7px!important;padding-top:7px!important;border-top:1px solid #dbe7f1!important}
#programs h3::before{content:"☷";color:var(--approved-blue)!important;font-size:16px!important}
#items{display:grid!important;gap:5px!important}

@media (min-width:861px){
  .workflow-item.item-row{
    display:grid!important;grid-template-columns:28px 72px minmax(145px,1.18fr) minmax(122px,.92fr) minmax(150px,1.15fr) minmax(150px,1.12fr) 31px 31px!important;
    grid-template-rows:40px 29px!important;gap:4px 8px!important;align-items:center!important;
    margin:0!important;padding:6px 7px!important;min-height:82px!important;overflow:visible!important;
    border:1px solid #cbddec!important;border-left:1px solid #cbddec!important;border-radius:7px!important;
    background:#fff!important;box-shadow:0 1px 4px rgba(5,45,80,.035)!important;transform:none!important;
  }
  .workflow-item.item-row:hover,.workflow-item.item-row:focus-within{transform:none!important;border-color:#91bde3!important;box-shadow:0 0 0 2px rgba(8,105,199,.08)!important}
  .workflow-item>.workflow-seq{grid-column:1!important;grid-row:1/3!important;width:22px!important;height:26px!important;border:0!important;border-radius:4px!important;background:var(--approved-blue-soft)!important;color:#0b5798!important;font-size:12px!important;font-weight:600!important}
  .workflow-item>.workflow-required{grid-column:2!important;grid-row:1/3!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:1px!important;font-size:11px!important;font-weight:500!important;text-align:center!important;white-space:nowrap!important}
  .workflow-item>.workflow-required::before{content:"Required";font-size:10px!important;font-weight:500!important;color:var(--approved-ink)!important}
  .workflow-item>.workflow-required{font-size:0!important}
  .workflow-item>.workflow-required::after{content:"Yes";font-size:10px!important;color:#315575!important}
  .workflow-item>.workflow-required:has(input:not(:checked))::after{content:"No"}
  .workflow-item>.workflow-required input{appearance:none!important;-webkit-appearance:none!important;width:30px!important;height:17px!important;margin:0!important;border:0!important;border-radius:99px!important;background:#aabccc!important;position:relative!important;cursor:pointer!important}
  .workflow-item>.workflow-required input::after{content:""!important;position:absolute!important;top:2px!important;left:2px!important;width:13px!important;height:13px!important;border-radius:50%!important;background:#fff!important;box-shadow:0 1px 2px rgba(0,0,0,.24)!important;transition:left .12s ease!important}
  .workflow-item>.workflow-required input:checked{background:#0878df!important}
  .workflow-item>.workflow-required input:checked::after{left:15px!important}
  .workflow-item>label:nth-of-type(2){grid-column:3!important;grid-row:1!important}.workflow-item>label:nth-of-type(3){grid-column:4!important;grid-row:1!important}.workflow-item>label:nth-of-type(4){grid-column:5!important;grid-row:1!important}.workflow-item>label:nth-of-type(5){grid-column:6!important;grid-row:1!important}
  .workflow-item>label:nth-of-type(6){grid-column:3/7!important;grid-row:2!important;display:grid!important;grid-template-columns:42px minmax(0,1fr)!important;align-items:center!important;gap:5px!important;min-width:0!important}
  .workflow-item>label:nth-of-type(6)::first-line{font-weight:500!important}
  .workflow-item>label:nth-of-type(6) input{width:100%!important;min-width:0!important;height:27px!important;min-height:27px!important}
  .workflow-item>label:not(.workflow-required){font-size:10px!important;font-weight:500!important}
  .workflow-item>label:not(.workflow-required)>input,.workflow-item>label:not(.workflow-required)>select{height:28px!important;min-height:28px!important;font-size:11px!important}
  .workflow-item>.workflow-row-actions{display:contents!important}
  .workflow-item>.workflow-row-actions>.item-up,.workflow-item>.workflow-row-actions>.item-down{grid-column:7!important;width:28px!important;min-width:28px!important;height:27px!important;min-height:27px!important;padding:0!important;justify-self:center!important;color:transparent!important;overflow:hidden!important;background:#eaf4fe!important;border-color:#bdd8ef!important;position:relative!important}
  .workflow-item>.workflow-row-actions>.item-up{grid-row:1!important;align-self:start!important}.workflow-item>.workflow-row-actions>.item-down{grid-row:1!important;align-self:end!important}
  .workflow-item>.workflow-row-actions>.item-up::after,.workflow-item>.workflow-row-actions>.item-down::after{position:absolute!important;inset:0!important;display:grid!important;place-items:center!important;color:#075da7!important;font-size:16px!important;font-weight:600!important}
  .workflow-item>.workflow-row-actions>.item-up::after{content:"↑"!important}.workflow-item>.workflow-row-actions>.item-down::after{content:"↓"!important}
  .workflow-item>.workflow-row-actions>.item-remove{grid-column:8!important;grid-row:1!important;align-self:center!important;justify-self:center!important;width:28px!important;min-width:28px!important;height:28px!important;min-height:28px!important;padding:0!important;color:transparent!important;overflow:hidden!important;background:#fff0f1!important;border:1px solid #ff9da4!important;position:relative!important}
  .workflow-item>.workflow-row-actions>.item-remove::after{content:"🗑"!important;position:absolute!important;inset:0!important;display:grid!important;place-items:center!important;color:var(--approved-red)!important;font-size:13px!important}
  .workflow-item>.workflow-row-actions>.item-scripture,.workflow-item>.workflow-row-actions>.item-hymn,.workflow-item>.workflow-row-actions>.item-worship-resource,.workflow-item>.workflow-row-actions>.v8-open-report,.workflow-item>.workflow-row-actions>.v82-read-report{grid-column:6/9!important;grid-row:2!important;justify-self:end!important;max-width:190px!important;min-width:120px!important;height:27px!important;min-height:27px!important;padding:3px 8px!important;font-size:10px!important;background:#eef7ff!important;color:#0865b7!important;border-color:#acd2f1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .workflow-item>.workflow-row-actions>button.hidden{display:none!important}
  .workflow-item:has(.workflow-row-actions>.item-scripture:not(.hidden))>label:nth-of-type(6),.workflow-item:has(.workflow-row-actions>.item-hymn:not(.hidden))>label:nth-of-type(6),.workflow-item:has(.workflow-row-actions>.item-worship-resource:not(.hidden))>label:nth-of-type(6){grid-column:3/6!important}
}

/* Keep toolbars tidy and eliminate control collisions. */
#programs>.card:first-child>p{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:6px!important;flex-wrap:wrap!important;margin:9px 0 0!important}
.worship-resource-picker .row,.hymn-picker-actions,.scripture-picker-actions{display:flex!important;align-items:center!important;gap:6px!important;flex-wrap:wrap!important}
.worship-resource-picker button,.hymn-picker-actions button,.scripture-picker-actions button{width:auto!important;min-width:76px!important;white-space:normal!important;line-height:1.15!important}

@media(max-width:860px){
  #portalView:not(.hidden){padding-top:51px!important}
  #portalView>nav{height:auto!important;min-height:48px!important;max-height:none!important;overflow-x:auto!important;overflow-y:hidden!important;flex-wrap:nowrap!important;scrollbar-width:none!important}
  #portalView>nav::-webkit-scrollbar{display:none!important}
  #portalView>nav button{flex:0 0 auto!important}
  .workflow-item.item-row{margin:0!important;padding:7px!important;border:1px solid var(--approved-line)!important;border-radius:7px!important;background:#fff!important;box-shadow:none!important;overflow:visible!important}
  .workflow-item>.workflow-row-actions{display:flex!important;align-items:center!important;gap:5px!important;flex-wrap:wrap!important}
}
@media(max-width:620px){
  #portalView>nav button{padding-right:7px!important;padding-left:25px!important;font-size:11px!important}
  #portalView>.page{margin-top:6px!important}
  #portalView .card{padding:9px!important}
  #programs>.card:first-child>.grid{grid-template-columns:1fr!important}
}

@media print{
  body{padding:0!important;background:#fff!important}
  #portalView:not(.hidden){padding:0!important}
  #portalView>nav{display:none!important}
  #portalView>.page{margin:0!important;max-width:none!important}
}

/* ============================================================
   LOCKED ULTRA-ELITE REFERENCE — BUILD 3
   Supersedes Build 2. Do not reinterpret this design.
   ============================================================ */
:root{--ue3-navy:#062b50;--ue3-deep:#031d38;--ue3-blue:#066fd7;--ue3-line:#cfe1f1;--ue3-gold:#f0b91b;--ue3-bg:#eef5fb;--ue3-red:#ef3340}
body:has(#portalView:not(.hidden)){background:linear-gradient(#edf5fb,#f7fbff)!important}
#portalView:not(.hidden){padding:43px 12px 42px!important;background:transparent!important}
#portalView>nav{height:43px!important;max-height:43px!important;padding:4px 14px!important;border-bottom:1px solid #315878!important;border-radius:0 0 18px 18px!important;background:linear-gradient(180deg,#082f55,#031f3d)!important;box-shadow:0 4px 15px rgba(0,25,52,.25)!important}
#portalView>nav button{height:29px!important;min-height:29px!important;padding:3px 9px 3px 25px!important;border-radius:5px!important;font-size:10px!important;color:#f1f7fd!important}
#portalView>nav button::before{left:8px!important;width:11px!important;height:11px!important}
#portalView>nav button.is-active,#portalView>nav button[aria-current="page"]{background:#f7fbff!important;color:#0766bd!important;border-color:#cde1f2!important;box-shadow:0 2px 7px rgba(0,0,0,.18)!important}
#portalView>nav #logoutBtn{border:1px solid #86a7c3!important;border-radius:999px!important;padding-right:12px!important;background:transparent!important;color:#fff!important}
#portalView>.page{max-width:1580px!important;margin:7px auto 0!important}
#portalView .card{border-radius:7px!important;border-color:var(--ue3-line)!important;box-shadow:0 2px 7px rgba(6,43,80,.05)!important}

/* Reference worship masthead, injected without changing program behavior. */
#programs>.card:first-child{position:relative!important;padding-top:142px!important}
#programs>.card:first-child::before{content:""!important;display:block!important;position:absolute!important;left:8px!important;right:8px!important;top:8px!important;height:124px!important;border-radius:7px!important;background:#052b51 url("approved-divine-worship-banner.svg") center/cover no-repeat!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 3px 8px rgba(4,34,64,.18)!important}
#programs #programEditorHeading{position:absolute!important;left:32px!important;top:25px!important;z-index:2!important;color:transparent!important;font-size:0!important}
#programs #programEditorHeading::after{content:""!important}
#programs>.card:first-child>.grid{display:grid!important;grid-template-columns:minmax(155px,.72fr) minmax(155px,.72fr) minmax(260px,1.45fr) repeat(3,auto)!important;gap:6px!important;margin:0 0 7px!important;padding:7px!important;border:1px solid #d4e4f1!important;border-radius:6px!important;background:#fff!important}
#programs>.card:first-child>.grid label{font-size:9px!important;font-weight:500!important;color:#173c5e!important}
#programs>.card:first-child>.grid label::before{color:#0873da!important}
#programs>.card:first-child>.grid input,#programs>.card:first-child>.grid select{height:27px!important;min-height:27px!important;font-size:10px!important}
#programWorkflowHint{position:relative!important;margin:0 0 7px!important;min-height:48px!important;padding:7px 155px 7px 36px!important;border:1px solid #f2cf66!important;border-left:1px solid #f2cf66!important;background:#fff7d7!important;color:#334c60!important;font-size:10px!important}
#programWorkflowHint::before{content:"💡"!important;position:absolute!important;left:11px!important;top:11px!important;font-size:17px!important}
#programWorkflowHint::after{content:"↻  Restore Default Order"!important;position:absolute!important;right:8px!important;top:9px!important;padding:6px 10px!important;border-radius:5px!important;background:#f0b90b!important;color:#183b56!important;font-size:10px!important;font-weight:600!important}
#programs h3{height:31px!important;margin:0!important;padding:6px 8px!important;border:1px solid #d1e2f0!important;border-radius:6px 6px 0 0!important;background:#f8fbfe!important;font-size:13px!important}
#programs h3::before{content:"☷"!important;color:#0872d5!important}
#items{gap:3px!important;padding:5px!important;border:1px solid #d1e2f0!important;border-top:0!important;background:#f7fbfe!important}

@media(min-width:981px){
.workflow-item.item-row{grid-template-columns:20px 24px 55px minmax(145px,1.15fr) minmax(115px,.85fr) minmax(135px,1fr) minmax(130px,.95fr) minmax(145px,1.1fr) 27px 27px!important;grid-template-rows:28px 22px!important;gap:2px 5px!important;min-height:56px!important;padding:3px 5px!important;border-radius:5px!important;border-color:#d5e4f0!important;background:#fff!important}
.workflow-item>.workflow-seq{grid-column:1!important;grid-row:1/3!important;width:18px!important;height:22px!important;font-size:9px!important;border-radius:3px!important}
.workflow-item::before{content:"⠿"!important;grid-column:2!important;grid-row:1/3!important;align-self:center!important;color:#9cb8cf!important;font-size:12px!important}
.workflow-item>.workflow-required{grid-column:3!important;grid-row:1/3!important;font-size:0!important}
.workflow-item>.workflow-required::before{font-size:8px!important}.workflow-item>.workflow-required::after{font-size:8px!important}
.workflow-item>.workflow-required input{width:26px!important;height:14px!important}.workflow-item>.workflow-required input::after{width:10px!important;height:10px!important}.workflow-item>.workflow-required input:checked::after{left:14px!important}
.workflow-item>label:nth-of-type(2){grid-column:4!important}.workflow-item>label:nth-of-type(3){grid-column:5!important}.workflow-item>label:nth-of-type(4){grid-column:6!important}.workflow-item>label:nth-of-type(5){grid-column:7!important}.workflow-item>label:nth-of-type(6){grid-column:8!important;grid-row:1!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:1px!important}
.workflow-item>label:not(.workflow-required){font-size:8px!important;line-height:1.05!important}.workflow-item>label:not(.workflow-required)>input,.workflow-item>label:not(.workflow-required)>select{height:22px!important;min-height:22px!important;padding:2px 5px!important;font-size:9px!important;border-radius:3px!important}
.workflow-item>label:nth-of-type(6) input{height:22px!important;min-height:22px!important}
.workflow-item>.workflow-row-actions>.item-up,.workflow-item>.workflow-row-actions>.item-down{grid-column:9!important;width:23px!important;min-width:23px!important;height:22px!important;min-height:22px!important;border-radius:3px!important}
.workflow-item>.workflow-row-actions>.item-up::after,.workflow-item>.workflow-row-actions>.item-down::after{font-size:12px!important}
.workflow-item>.workflow-row-actions>.item-remove{grid-column:10!important;width:23px!important;min-width:23px!important;height:23px!important;min-height:23px!important;border-radius:3px!important}
.workflow-item>.workflow-row-actions>.item-remove::after{font-size:10px!important}
.workflow-item>.workflow-row-actions>.item-scripture,.workflow-item>.workflow-row-actions>.item-hymn,.workflow-item>.workflow-row-actions>.item-worship-resource,.workflow-item>.workflow-row-actions>.v8-open-report,.workflow-item>.workflow-row-actions>.v82-read-report{grid-column:8/11!important;grid-row:2!important;height:20px!important;min-height:20px!important;max-width:150px!important;min-width:100px!important;padding:1px 6px!important;font-size:8px!important}
.workflow-item:has(.workflow-row-actions>.item-scripture:not(.hidden))>label:nth-of-type(6),.workflow-item:has(.workflow-row-actions>.item-hymn:not(.hidden))>label:nth-of-type(6),.workflow-item:has(.workflow-row-actions>.item-worship-resource:not(.hidden))>label:nth-of-type(6){grid-column:8!important}
}

/* Fixed reference footer/command dock. */
#portalView::after{content:attr(data-church-footer)!important;position:fixed!important;left:8px!important;right:8px!important;bottom:0!important;height:31px!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:0 16px!important;border-radius:18px 18px 0 0!important;background:linear-gradient(90deg,#052b50,#064879,#052b50)!important;border-top:2px solid #d8a721!important;color:#d8e9f7!important;font-size:8px!important;letter-spacing:.03em!important;z-index:1050!important;box-shadow:0 -3px 10px rgba(2,24,47,.16)!important}
#programs>.card:first-child>p{position:sticky!important;bottom:34px!important;z-index:30!important;margin:6px 0 0!important;padding:5px!important;border:1px solid #d1e2ef!important;border-radius:6px!important;background:rgba(248,252,255,.96)!important;backdrop-filter:blur(6px)!important}
#programs>.card:first-child>p button{height:26px!important;min-height:26px!important;font-size:9px!important}
#saveProgramBtn{background:#076dd1!important;color:#fff!important;border-color:#075cae!important}

@media(max-width:980px){#programs>.card:first-child{padding-top:125px!important}#programs>.card:first-child::before{height:108px!important}#portalView::after{font-size:7px!important}.workflow-item.item-row{font-size:10px!important}}
@media(max-width:700px){#programs>.card:first-child>.grid{grid-template-columns:1fr!important}#programWorkflowHint{padding-right:8px!important}#programWorkflowHint::after{display:none!important}}

/* ============================================================
   LOGIN INTERACTION AUTHORITY — BUILD 4
   The signed-out form must always sit above legacy navigation overlays.
   ============================================================ */
body:has(#loginView:not(.hidden)){pointer-events:auto!important}
body:has(#loginView:not(.hidden))::before,
body:has(#loginView:not(.hidden))::after,
body.v91-nav-open:has(#loginView:not(.hidden))::after{display:none!important;content:none!important;pointer-events:none!important}
body:has(#loginView:not(.hidden)) .appbar{pointer-events:none!important}
#loginView:not(.hidden){position:relative!important;z-index:2147483000!important;isolation:isolate!important;pointer-events:auto!important;user-select:auto!important}
#loginView:not(.hidden)::before,#loginView:not(.hidden)::after,#loginView:not(.hidden) .row::before,#loginView:not(.hidden) .row::after{pointer-events:none!important}
#loginView:not(.hidden) .row,#loginView:not(.hidden) label,#loginView:not(.hidden) input,#loginView:not(.hidden) select,#loginView:not(.hidden) button,#loginView:not(.hidden) .status{position:relative!important;z-index:2!important;pointer-events:auto!important;user-select:auto!important}
#loginView:not(.hidden) input,#loginView:not(.hidden) select,#loginView:not(.hidden) button{opacity:1!important;filter:none!important;cursor:auto!important}
#loginView:not(.hidden) button{cursor:pointer!important}
#loginView:not(.hidden) input:focus,#loginView:not(.hidden) select:focus,#loginView:not(.hidden) button:focus-visible{outline:3px solid #ffbf47!important;outline-offset:2px!important}

/* ============================================================
   COMPLETE VISUAL CORRECTION — BUILD 5
   Corrects the production screenshot while preserving the locked design.
   ============================================================ */
#programs>.card:first-child{padding-top:142px!important;overflow:visible!important}
#programs>.card:first-child::before{height:124px!important;background-size:100% 100%!important;background-position:center!important}
#programs #programEditorHeading{display:none!important}
#programWorkflowHint{overflow:visible!important}
#items{overflow:visible!important}

@media(min-width:981px){
  .workflow-item.item-row{
    grid-template-columns:16px 20px 50px minmax(150px,1.18fr) minmax(120px,.88fr) minmax(145px,1.04fr) minmax(140px,1fr) 24px 24px!important;
    grid-template-rows:32px 24px!important;column-gap:5px!important;row-gap:3px!important;
    min-height:65px!important;width:100%!important;max-width:100%!important;padding:3px 5px!important;
    overflow:visible!important;align-items:stretch!important;
  }
  .workflow-item::before{grid-column:1!important;grid-row:1/3!important;align-self:center!important;justify-self:center!important;font-size:11px!important}
  .workflow-item>.workflow-seq{grid-column:2!important;grid-row:1/3!important;width:19px!important;height:24px!important;align-self:center!important}
  .workflow-item>.workflow-required{grid-column:3!important;grid-row:1/3!important;display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:center!important;gap:1px!important;overflow:visible!important}
  .workflow-item>.workflow-required::before{content:"Required"!important;display:block!important;order:0!important;font-size:8px!important;line-height:1!important;font-weight:500!important;color:#163a5b!important}
  .workflow-item>.workflow-required input{order:1!important;position:relative!important;left:auto!important;bottom:auto!important;width:27px!important;height:15px!important;min-width:27px!important;min-height:15px!important;opacity:1!important;margin:1px 0!important}
  .workflow-item>.workflow-required input::after{width:11px!important;height:11px!important;top:2px!important;left:2px!important}
  .workflow-item>.workflow-required input:checked::after{left:14px!important}
  .workflow-item>.workflow-required::after{order:2!important;font-size:8px!important;line-height:1!important}

  .workflow-item>label:nth-of-type(2){grid-column:4!important;grid-row:1!important}
  .workflow-item>label:nth-of-type(3){grid-column:5!important;grid-row:1!important}
  .workflow-item>label:nth-of-type(4){grid-column:6!important;grid-row:1!important}
  .workflow-item>label:nth-of-type(5){grid-column:7!important;grid-row:1!important}
  .workflow-item>label:nth-of-type(6){grid-column:4/8!important;grid-row:2!important;display:grid!important;grid-template-columns:38px minmax(0,1fr)!important;align-items:center!important;gap:4px!important;min-width:0!important;height:24px!important;overflow:visible!important}
  .workflow-item>label:nth-of-type(6)::before{content:"▤"!important;display:inline!important;margin-right:2px!important;color:#076abd!important}
  .workflow-item>label:nth-of-type(6) input{height:22px!important;min-height:22px!important;width:100%!important;min-width:0!important}
  .workflow-item>label:not(.workflow-required){min-width:0!important;overflow:visible!important;white-space:nowrap!important}
  .workflow-item>label:not(.workflow-required)>input,.workflow-item>label:not(.workflow-required)>select{width:100%!important;min-width:0!important}

  .workflow-item>.workflow-row-actions{display:contents!important}
  .workflow-item>.workflow-row-actions>.item-up,.workflow-item>.workflow-row-actions>.item-down{
    grid-column:8!important;width:22px!important;min-width:22px!important;height:14px!important;min-height:14px!important;padding:0!important;margin:0!important;
    align-self:auto!important;justify-self:center!important;border-radius:3px!important;color:transparent!important;font-size:0!important;line-height:1!important;overflow:hidden!important;
  }
  .workflow-item>.workflow-row-actions>.item-up{grid-row:1!important;align-self:start!important}
  .workflow-item>.workflow-row-actions>.item-down{grid-row:1!important;align-self:end!important}
  .workflow-item>.workflow-row-actions>.item-up::after,.workflow-item>.workflow-row-actions>.item-down::after{font-size:10px!important;line-height:1!important}
  .workflow-item>.workflow-row-actions>.item-remove{grid-column:9!important;grid-row:1!important;width:22px!important;min-width:22px!important;height:28px!important;min-height:28px!important;align-self:center!important;padding:0!important;margin:0!important;overflow:hidden!important}

  .workflow-item>.workflow-row-actions>.item-scripture,.workflow-item>.workflow-row-actions>.item-hymn,.workflow-item>.workflow-row-actions>.item-worship-resource,.workflow-item>.workflow-row-actions>.v8-open-report,.workflow-item>.workflow-row-actions>.v82-read-report{
    grid-column:7/10!important;grid-row:2!important;justify-self:end!important;align-self:center!important;
    width:auto!important;max-width:185px!important;min-width:112px!important;height:22px!important;min-height:22px!important;
    padding:2px 7px!important;margin:0!important;font-size:8px!important;line-height:1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;
  }
  .workflow-item:has(.workflow-row-actions>.item-scripture:not(.hidden))>label:nth-of-type(6),
  .workflow-item:has(.workflow-row-actions>.item-hymn:not(.hidden))>label:nth-of-type(6),
  .workflow-item:has(.workflow-row-actions>.item-worship-resource:not(.hidden))>label:nth-of-type(6),
  .workflow-item:has(.workflow-row-actions>.v8-open-report:not(.hidden))>label:nth-of-type(6),
  .workflow-item:has(.workflow-row-actions>.v82-read-report:not(.hidden))>label:nth-of-type(6){grid-column:4/7!important}
  .workflow-item>.workflow-row-actions>button.hidden{display:none!important}
}

@media(min-width:981px) and (max-width:1180px){
  .workflow-item.item-row{grid-template-columns:14px 19px 46px minmax(125px,1.1fr) minmax(105px,.85fr) minmax(125px,1fr) minmax(120px,.95fr) 23px 23px!important;column-gap:4px!important}
  .workflow-item>.workflow-row-actions>.item-scripture,.workflow-item>.workflow-row-actions>.item-hymn,.workflow-item>.workflow-row-actions>.item-worship-resource{max-width:145px!important;min-width:95px!important}
}

@media(max-width:980px){
  #programs>.card:first-child::before{background-size:cover!important;background-position:center!important}
  .workflow-item.item-row{overflow:visible!important}
  .workflow-item>.workflow-row-actions button{font-size:10px!important}
}

/* ============================================================
   FIXED PORTAL BANNER + COMPLETE ROW VISIBILITY — REPAIR 6
   One fixed masthead on every signed-in page. Program rows use a
   dedicated Notes band and a separate, fully visible action group.
   ============================================================ */
#portalView:not(.hidden){
  padding:177px 6px 42px!important;
  overflow-x:hidden!important;
}
#portalView:not(.hidden)::before{
  content:""!important;
  display:block!important;
  position:fixed!important;
  left:6px!important;
  right:6px!important;
  top:49px!important;
  height:120px!important;
  z-index:1100!important;
  pointer-events:none!important;
  border:1px solid #c8dced!important;
  border-radius:7px!important;
  background:#052b51 url("approved-divine-worship-banner.svg") center/100% 100% no-repeat!important;
  box-shadow:0 3px 10px rgba(4,34,64,.18)!important;
}
#portalView>.page{
  width:100%!important;
  max-width:none!important;
  margin:7px 0 0!important;
  min-width:0!important;
}

/* The global fixed banner replaces the old Programs-only card banner. */
#programs>.card:first-child{
  padding-top:12px!important;
}
#programs>.card:first-child::before{
  content:none!important;
  display:none!important;
}
#items{
  width:100%!important;
  min-width:0!important;
  overflow:visible!important;
}

@media(min-width:1101px){
  .workflow-item.item-row{
    grid-template-columns:18px 22px 58px minmax(210px,1.35fr) minmax(155px,.92fr) minmax(195px,1.18fr) minmax(185px,1.08fr) 30px 30px!important;
    grid-template-rows:38px 34px!important;
    column-gap:6px!important;
    row-gap:5px!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    min-height:84px!important;
    padding:4px 6px!important;
    overflow:visible!important;
  }
  .workflow-item::before{grid-column:1!important;grid-row:1/3!important}
  .workflow-item>.workflow-seq{grid-column:2!important;grid-row:1/3!important}
  .workflow-item>.workflow-required{grid-column:3!important;grid-row:1/3!important}
  .workflow-item>label:nth-of-type(2){grid-column:4!important;grid-row:1!important}
  .workflow-item>label:nth-of-type(3){grid-column:5!important;grid-row:1!important}
  .workflow-item>label:nth-of-type(4){grid-column:6!important;grid-row:1!important}
  .workflow-item>label:nth-of-type(5){grid-column:7!important;grid-row:1!important}
  .workflow-item>label:nth-of-type(6),
  .workflow-item:has(.workflow-row-actions>.item-scripture:not(.hidden))>label:nth-of-type(6),
  .workflow-item:has(.workflow-row-actions>.item-hymn:not(.hidden))>label:nth-of-type(6),
  .workflow-item:has(.workflow-row-actions>.item-worship-resource:not(.hidden))>label:nth-of-type(6),
  .workflow-item:has(.workflow-row-actions>.v8-open-report:not(.hidden))>label:nth-of-type(6),
  .workflow-item:has(.workflow-row-actions>.v82-read-report:not(.hidden))>label:nth-of-type(6){
    grid-column:4/7!important;
    grid-row:2!important;
    display:grid!important;
    grid-template-columns:46px minmax(0,1fr)!important;
    align-items:center!important;
    width:100%!important;
    min-width:0!important;
    height:34px!important;
    overflow:visible!important;
  }
  .workflow-item>label:nth-of-type(6) input{
    width:100%!important;
    min-width:0!important;
    height:27px!important;
    min-height:27px!important;
  }
  .workflow-item>.workflow-row-actions>.item-up,
  .workflow-item>.workflow-row-actions>.item-down{
    grid-column:8!important;
    width:28px!important;
    min-width:28px!important;
    height:18px!important;
    min-height:18px!important;
    overflow:visible!important;
  }
  .workflow-item>.workflow-row-actions>.item-remove{
    grid-column:9!important;
    grid-row:1!important;
    width:28px!important;
    min-width:28px!important;
    height:36px!important;
    min-height:36px!important;
    overflow:visible!important;
  }
  .workflow-item>.workflow-row-actions>.item-scripture,
  .workflow-item>.workflow-row-actions>.item-hymn,
  .workflow-item>.workflow-row-actions>.item-worship-resource,
  .workflow-item>.workflow-row-actions>.v8-open-report,
  .workflow-item>.workflow-row-actions>.v82-read-report{
    grid-column:7/10!important;
    grid-row:2!important;
    justify-self:stretch!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:28px!important;
    min-height:28px!important;
    padding:3px 7px!important;
    font-size:9px!important;
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
}

/* ============================================================
   COMMUNICATION CENTER — REPAIR 16
   ============================================================ */
.communication-center{overflow:visible!important}
.communication-grid{display:grid!important;grid-template-columns:minmax(260px,1.3fr) minmax(210px,.8fr) minmax(260px,1fr)!important;gap:12px!important;align-items:end!important}
.communication-recipient-tools,.communication-actions{display:flex!important;align-items:center!important;gap:8px!important;flex-wrap:wrap!important;margin:12px 0!important}
.communication-recipients{margin:10px 0 14px!important;padding:12px!important;border:1px solid #c7d9e8!important;border-radius:9px!important;background:#f8fbfe!important}
.communication-recipients legend{padding:0 7px!important;color:#123f68!important;font-weight:700!important}
#communicationRecipients{display:grid!important;grid-template-columns:repeat(2,minmax(280px,1fr))!important;gap:7px!important}
.communication-recipient{display:grid!important;grid-template-columns:22px minmax(130px,1fr) auto!important;align-items:center!important;gap:8px!important;padding:8px 10px!important;border:1px solid #d4e2ee!important;border-radius:7px!important;background:#fff!important}
.communication-recipient>input{width:18px!important;height:18px!important;min-width:18px!important;min-height:18px!important;margin:0!important}
.communication-recipient span{min-width:0!important}.communication-recipient small{display:block!important;margin-top:2px!important;color:#55728b!important}
.communication-contact-badges{display:flex!important;gap:4px!important;flex-wrap:wrap!important;justify-content:flex-end!important}
.communication-contact-badges .pill{font-size:9px!important}.communication-contact-badges .missing{background:#fff0f0!important;color:#a12b2b!important}
.communication-message-label{display:block!important;font-weight:650!important}.communication-message-label textarea{display:block!important;width:100%!important;min-height:125px!important;margin-top:5px!important;resize:vertical!important}
.communication-preview{margin:12px 0!important;padding:12px!important;border:1px solid #aacde9!important;border-radius:9px!important;background:#f1f8ff!important}
.communication-preview article{margin:8px 0!important;padding:10px!important;border:1px solid #d5e4f0!important;border-radius:7px!important;background:#fff!important}
.communication-preview pre{margin:7px 0 0!important;white-space:pre-wrap!important;overflow-wrap:anywhere!important;font-family:inherit!important;font-size:12px!important;line-height:1.45!important}
@media(max-width:900px){.communication-grid,#communicationRecipients{grid-template-columns:1fr!important}.communication-recipient{grid-template-columns:22px minmax(0,1fr)!important}.communication-contact-badges{grid-column:2!important;justify-content:flex-start!important}}

@media(max-width:1100px){
  #portalView:not(.hidden){padding-top:160px!important}
  #portalView:not(.hidden)::before{height:103px!important;background-size:cover!important}
  .workflow-item.item-row{overflow:visible!important}
}

/* ============================================================
   SEMANTIC PROGRAM ROW AUTHORITY — REPAIR 7
   Explicit classes replace all fragile nth-of-type placement.
   ============================================================ */
.workflow-item>.workflow-required::before,
.workflow-item>.workflow-required::after{
  content:none!important;
  display:none!important;
}
.workflow-item>.workflow-required{
  font-size:initial!important;
  white-space:normal!important;
  overflow:visible!important;
}
.workflow-item>.workflow-required .required-title,
.workflow-item>.workflow-required .required-state{
  display:block!important;
  margin:0!important;
  padding:0!important;
  color:#173c5e!important;
  font-size:9px!important;
  font-weight:500!important;
  line-height:1!important;
  text-align:center!important;
  white-space:nowrap!important;
}
.workflow-item>.workflow-notes::before{
  content:"▤"!important;
  display:inline-block!important;
  color:#076abd!important;
  font-size:11px!important;
  line-height:1!important;
}

@media(min-width:1101px){
  .workflow-item.item-row{
    display:grid!important;
    grid-template-columns:18px 24px 64px minmax(220px,1.35fr) minmax(160px,.92fr) minmax(200px,1.15fr) minmax(190px,1.08fr) 32px 32px!important;
    grid-template-rows:40px 36px!important;
    gap:5px 6px!important;
    min-height:88px!important;
    height:auto!important;
    padding:4px 6px!important;
    overflow:visible!important;
  }
  .workflow-item::before{grid-column:1!important;grid-row:1/3!important;align-self:center!important;justify-self:center!important}
  .workflow-item>.workflow-seq{grid-column:2!important;grid-row:1/3!important;align-self:center!important;justify-self:center!important}
  .workflow-item>.workflow-required{
    grid-column:3!important;
    grid-row:1/3!important;
    align-self:center!important;
    justify-self:stretch!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:3px!important;
    width:64px!important;
    min-width:64px!important;
    height:72px!important;
  }
  .workflow-item>.workflow-required input{
    position:relative!important;
    inset:auto!important;
    display:block!important;
    order:initial!important;
    width:30px!important;
    min-width:30px!important;
    height:16px!important;
    min-height:16px!important;
    margin:0!important;
    opacity:1!important;
  }
  .workflow-item>.workflow-duty-label{grid-column:4!important;grid-row:1!important}
  .workflow-item>.workflow-duty-code{grid-column:5!important;grid-row:1!important}
  .workflow-item>.workflow-person{grid-column:6!important;grid-row:1!important}
  .workflow-item>.workflow-other-person{grid-column:7!important;grid-row:1!important}
  .workflow-item>.workflow-duty-label,
  .workflow-item>.workflow-duty-code,
  .workflow-item>.workflow-person,
  .workflow-item>.workflow-other-person{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:2px!important;
    width:100%!important;
    min-width:0!important;
    height:40px!important;
    overflow:visible!important;
    font-size:9px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  .workflow-item>.workflow-duty-label>input,
  .workflow-item>.workflow-duty-code>input,
  .workflow-item>.workflow-person>select,
  .workflow-item>.workflow-other-person>input{
    width:100%!important;
    min-width:0!important;
    height:27px!important;
    min-height:27px!important;
    padding:3px 7px!important;
    font-size:10px!important;
  }
  .workflow-item>.workflow-notes,
  .workflow-item:has(.workflow-row-actions>.item-scripture:not(.hidden))>.workflow-notes,
  .workflow-item:has(.workflow-row-actions>.item-hymn:not(.hidden))>.workflow-notes,
  .workflow-item:has(.workflow-row-actions>.item-worship-resource:not(.hidden))>.workflow-notes,
  .workflow-item:has(.workflow-row-actions>.v8-open-report:not(.hidden))>.workflow-notes,
  .workflow-item:has(.workflow-row-actions>.v82-read-report:not(.hidden))>.workflow-notes{
    grid-column:4/7!important;
    grid-row:2!important;
    display:grid!important;
    grid-template-columns:14px 38px minmax(0,1fr)!important;
    align-items:center!important;
    gap:4px!important;
    width:100%!important;
    min-width:0!important;
    height:36px!important;
    margin:0!important;
    overflow:visible!important;
  }
  .workflow-item>.workflow-notes .notes-title{
    display:block!important;
    font-size:9px!important;
    font-weight:500!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  .workflow-item>.workflow-notes .item-notes{
    width:100%!important;
    min-width:0!important;
    height:28px!important;
    min-height:28px!important;
    padding:3px 7px!important;
    font-size:10px!important;
  }
  .workflow-item>.workflow-row-actions{display:contents!important}
  .workflow-item>.workflow-row-actions>.item-up,
  .workflow-item>.workflow-row-actions>.item-down{
    grid-column:8!important;
    width:30px!important;
    min-width:30px!important;
    height:19px!important;
    min-height:19px!important;
    padding:0!important;
    margin:0!important;
    justify-self:center!important;
    overflow:hidden!important;
    color:transparent!important;
    font-size:0!important;
  }
  .workflow-item>.workflow-row-actions>.item-up{grid-row:1!important;align-self:start!important}
  .workflow-item>.workflow-row-actions>.item-down{grid-row:1!important;align-self:end!important}
  .workflow-item>.workflow-row-actions>.item-remove{
    grid-column:9!important;
    grid-row:1!important;
    align-self:center!important;
    justify-self:center!important;
    width:30px!important;
    min-width:30px!important;
    height:38px!important;
    min-height:38px!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
  }
  .workflow-item>.workflow-row-actions>.item-scripture,
  .workflow-item>.workflow-row-actions>.item-hymn,
  .workflow-item>.workflow-row-actions>.item-worship-resource,
  .workflow-item>.workflow-row-actions>.v8-open-report,
  .workflow-item>.workflow-row-actions>.v82-read-report{
    grid-column:7/10!important;
    grid-row:2!important;
    align-self:center!important;
    justify-self:stretch!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:29px!important;
    min-height:29px!important;
    margin:0!important;
    padding:3px 8px!important;
    overflow:hidden!important;
    color:#0866bb!important;
    font-size:9px!important;
    line-height:1!important;
    text-overflow:clip!important;
    white-space:nowrap!important;
  }
  .workflow-item>.workflow-row-actions>button.hidden{display:none!important}
}

@media(max-width:1100px){
  .workflow-item>.workflow-required{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    gap:3px!important;
  }
  .workflow-item>.workflow-notes{
    display:grid!important;
    grid-template-columns:14px 42px minmax(0,1fr)!important;
    align-items:center!important;
    gap:5px!important;
    width:100%!important;
  }
}

/* ============================================================
   CONTAINED PROGRAM ITEM ARCHITECTURE — REPAIR 8
   Each functional area owns its layout; legacy direct-child rules
   can no longer split Notes or consume the action columns.
   ============================================================ */
.workflow-item>.workflow-content,
.workflow-item>.workflow-content *{
  box-sizing:border-box!important;
}
.workflow-item>.workflow-content{
  min-width:0!important;
  width:100%!important;
  overflow:visible!important;
}
.workflow-item .workflow-resource-actions>button.hidden{
  display:none!important;
}

@media(min-width:1101px){
  .workflow-item.item-row{
    display:grid!important;
    grid-template-columns:18px 26px 70px minmax(0,1fr) 68px!important;
    grid-template-rows:82px!important;
    align-items:stretch!important;
    gap:0 6px!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    min-height:92px!important;
    height:auto!important;
    padding:5px 6px!important;
    overflow:visible!important;
  }
  .workflow-item.item-row::before{
    grid-column:1!important;
    grid-row:1!important;
    align-self:center!important;
    justify-self:center!important;
    margin:0!important;
  }
  .workflow-item.item-row>.workflow-seq{
    grid-column:2!important;
    grid-row:1!important;
    align-self:center!important;
    justify-self:center!important;
    width:22px!important;
    height:28px!important;
    margin:0!important;
  }
  .workflow-item.item-row>.workflow-required{
    grid-column:3!important;
    grid-row:1!important;
    align-self:stretch!important;
    justify-self:stretch!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    width:70px!important;
    min-width:70px!important;
    height:82px!important;
    margin:0!important;
    padding:4px!important;
    overflow:visible!important;
  }
  .workflow-item.item-row>.workflow-required .required-title,
  .workflow-item.item-row>.workflow-required .required-state{
    position:static!important;
    display:block!important;
    width:100%!important;
    height:auto!important;
    margin:0!important;
    color:#173c5e!important;
    font-size:10px!important;
    font-weight:500!important;
    line-height:1!important;
    text-align:center!important;
    white-space:nowrap!important;
    overflow:visible!important;
  }
  .workflow-item.item-row>.workflow-required>.item-required{
    position:relative!important;
    inset:auto!important;
    display:block!important;
    flex:0 0 18px!important;
    width:32px!important;
    min-width:32px!important;
    height:18px!important;
    min-height:18px!important;
    margin:0!important;
    padding:0!important;
    opacity:1!important;
  }
  .workflow-item.item-row>.workflow-content{
    grid-column:4!important;
    grid-row:1!important;
    display:grid!important;
    grid-template-rows:42px 35px!important;
    gap:5px!important;
    min-width:0!important;
    height:82px!important;
  }
  .workflow-item .workflow-main-fields{
    display:grid!important;
    grid-template-columns:minmax(220px,1.3fr) minmax(165px,.9fr) minmax(210px,1.15fr) minmax(195px,1.05fr)!important;
    gap:6px!important;
    min-width:0!important;
    height:42px!important;
  }
  .workflow-item .workflow-main-fields>label{
    position:static!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:2px!important;
    width:100%!important;
    min-width:0!important;
    height:42px!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    color:#173c5e!important;
    font-size:10px!important;
    font-weight:500!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  .workflow-item .workflow-main-fields>label>input,
  .workflow-item .workflow-main-fields>label>select{
    position:static!important;
    display:block!important;
    width:100%!important;
    min-width:0!important;
    height:29px!important;
    min-height:29px!important;
    margin:0!important;
    padding:4px 7px!important;
    font-size:10px!important;
  }
  .workflow-item .workflow-lower-band{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(190px,280px)!important;
    gap:7px!important;
    align-items:center!important;
    min-width:0!important;
    height:35px!important;
  }
  .workflow-item .workflow-lower-band>.workflow-notes{
    position:static!important;
    display:grid!important;
    grid-template-columns:14px 38px minmax(0,1fr)!important;
    align-items:center!important;
    gap:4px!important;
    width:100%!important;
    min-width:0!important;
    height:35px!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
  }
  .workflow-item .workflow-lower-band>.workflow-notes::before{
    content:none!important;
    display:none!important;
  }
  .workflow-item .workflow-notes>.notes-icon{
    display:block!important;
    color:#076abd!important;
    font-size:11px!important;
    line-height:1!important;
    text-align:center!important;
  }
  .workflow-item .workflow-notes>.notes-title{
    display:block!important;
    color:#173c5e!important;
    font-size:10px!important;
    font-weight:500!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  .workflow-item .workflow-notes>.item-notes{
    position:static!important;
    display:block!important;
    width:100%!important;
    min-width:0!important;
    height:29px!important;
    min-height:29px!important;
    margin:0!important;
    padding:4px 7px!important;
    font-size:10px!important;
  }
  .workflow-item .workflow-resource-actions{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    min-width:0!important;
    width:100%!important;
    height:35px!important;
  }
  .workflow-item .workflow-resource-actions>button:not(.hidden){
    position:static!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:29px!important;
    min-height:29px!important;
    margin:0!important;
    padding:3px 8px!important;
    overflow:hidden!important;
    color:#0866bb!important;
    font-size:9px!important;
    line-height:1!important;
    text-overflow:clip!important;
    white-space:nowrap!important;
  }
  .workflow-item.item-row>.workflow-row-actions{
    grid-column:5!important;
    grid-row:1!important;
    display:grid!important;
    grid-template-columns:31px 31px!important;
    grid-template-rows:39px 39px!important;
    gap:4px 5px!important;
    align-self:center!important;
    justify-self:center!important;
    width:67px!important;
    min-width:67px!important;
    height:82px!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
  }
  .workflow-item.item-row>.workflow-row-actions>.item-up,
  .workflow-item.item-row>.workflow-row-actions>.item-down,
  .workflow-item.item-row>.workflow-row-actions>.item-remove{
    position:static!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:31px!important;
    min-width:31px!important;
    height:39px!important;
    min-height:39px!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    font-size:0!important;
    line-height:1!important;
  }
  .workflow-item.item-row>.workflow-row-actions>.item-up{grid-column:1!important;grid-row:1!important}
  .workflow-item.item-row>.workflow-row-actions>.item-down{grid-column:1!important;grid-row:2!important}
  .workflow-item.item-row>.workflow-row-actions>.item-remove{grid-column:2!important;grid-row:1/3!important;height:82px!important;min-height:82px!important}
  .workflow-item.item-row>.workflow-row-actions>.item-up::after{content:"↑"!important;font-size:16px!important;color:#075fae!important}
  .workflow-item.item-row>.workflow-row-actions>.item-down::after{content:"↓"!important;font-size:16px!important;color:#075fae!important}
}

@media(max-width:1100px){
  .workflow-item.item-row>.workflow-content{display:grid!important;gap:7px!important;width:100%!important}
  .workflow-item .workflow-main-fields{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important}
  .workflow-item .workflow-lower-band{display:grid!important;grid-template-columns:1fr!important;gap:7px!important}
  .workflow-item .workflow-notes{display:grid!important;grid-template-columns:14px 42px minmax(0,1fr)!important;align-items:center!important;gap:5px!important}
  .workflow-item .workflow-notes::before{content:none!important;display:none!important}
  .workflow-item .workflow-resource-actions{display:flex!important}
}

/* ============================================================
   RELIABLE ACTION GLYPHS — REPAIR 9
   The actual button content is now icon-only; no text clipping.
   ============================================================ */
.workflow-item.item-row>.workflow-row-actions>.item-up::before,
.workflow-item.item-row>.workflow-row-actions>.item-up::after,
.workflow-item.item-row>.workflow-row-actions>.item-down::before,
.workflow-item.item-row>.workflow-row-actions>.item-down::after,
.workflow-item.item-row>.workflow-row-actions>.item-remove::before,
.workflow-item.item-row>.workflow-row-actions>.item-remove::after{
  content:none!important;
  display:none!important;
}
.workflow-item.item-row>.workflow-row-actions>.item-up,
.workflow-item.item-row>.workflow-row-actions>.item-down{
  color:#075fae!important;
  font-size:0!important;
  font-weight:600!important;
}
.workflow-item.item-row>.workflow-row-actions>.item-up>span,
.workflow-item.item-row>.workflow-row-actions>.item-down>span{
  display:block!important;
  color:#075fae!important;
  font-family:"Segoe UI Symbol","Segoe UI",sans-serif!important;
  font-size:18px!important;
  font-weight:600!important;
  line-height:1!important;
}
.workflow-item.item-row>.workflow-row-actions>.item-remove{
  background:#fff2f2!important;
  color:#dc2638!important;
  border-color:#f1a9b1!important;
  font-size:0!important;
}
.workflow-item.item-row>.workflow-row-actions>.item-remove>.trash-glyph{
  position:relative!important;
  display:block!important;
  width:14px!important;
  height:16px!important;
  overflow:hidden!important;
  color:transparent!important;
  font-size:0!important;
}
.workflow-item.item-row>.workflow-row-actions>.item-remove>.trash-glyph::before{
  content:""!important;
  position:absolute!important;
  left:3px!important;
  top:4px!important;
  width:8px!important;
  height:10px!important;
  border:2px solid #dc2638!important;
  border-top-width:1px!important;
  border-radius:0 0 2px 2px!important;
}
.workflow-item.item-row>.workflow-row-actions>.item-remove>.trash-glyph::after{
  content:""!important;
  position:absolute!important;
  left:2px!important;
  top:1px!important;
  width:10px!important;
  height:2px!important;
  border-top:2px solid #dc2638!important;
  border-bottom:2px solid #dc2638!important;
  box-shadow:3px -2px 0 -1px #dc2638!important;
}

/* Proper inline trash icon — Repair 10 final visual authority. */
.workflow-item.item-row>.workflow-row-actions>.item-remove>.trash-icon{
  display:block!important;
  width:16px!important;
  height:16px!important;
  min-width:16px!important;
  min-height:16px!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  fill:#dc2638!important;
  stroke:none!important;
}

/* ============================================================
   LOCKED FULL-WORKSPACE REFERENCE MATCH — REPAIR 11
   The supplied navigation + Divine Worship workspace is the
   authority for the complete Programs page, not only the banner.
   ============================================================ */
#portalView:not(.hidden){
  position:relative!important;
  width:100%!important;
  height:100vh!important;
  min-height:100vh!important;
  padding:177px 6px 35px!important;
  overflow:hidden!important;
  background:#f3f8fc!important;
}
#portalView:not(.hidden)>.page:not(.hidden){
  display:block!important;
  width:100%!important;
  max-width:none!important;
  height:calc(100vh - 212px)!important;
  min-height:0!important;
  margin:0!important;
  padding:0 3px 8px!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  scrollbar-gutter:stable!important;
}
#portalView>nav{
  left:0!important;
  right:0!important;
  top:0!important;
  height:43px!important;
  max-height:43px!important;
  border-radius:0 0 18px 18px!important;
}
#portalView:not(.hidden)::before{
  left:7px!important;
  right:7px!important;
  top:49px!important;
  height:120px!important;
  border-radius:7px!important;
  background-size:100% 100%!important;
}
#programs>.card:first-child{
  margin:0!important;
  padding:6px!important;
  border-radius:7px!important;
}
#programs>.card:first-child>.grid{
  margin-bottom:5px!important;
  padding:5px!important;
  gap:5px!important;
}
#programWorkflowHint{
  min-height:42px!important;
  margin-bottom:5px!important;
  padding-top:5px!important;
  padding-bottom:5px!important;
}
#programs h3{
  height:28px!important;
  padding:5px 7px!important;
  font-size:12px!important;
}
#items{
  display:grid!important;
  gap:3px!important;
  width:100%!important;
  padding:4px!important;
}

@media(min-width:1101px){
  .workflow-item.item-row{
    grid-template-columns:16px 24px 64px minmax(0,1fr) 64px!important;
    grid-template-rows:62px!important;
    gap:0 5px!important;
    min-height:70px!important;
    height:70px!important;
    margin:0!important;
    padding:4px 5px!important;
    border-radius:4px!important;
  }
  .workflow-item.item-row>.workflow-seq{
    width:20px!important;
    height:24px!important;
    font-size:9px!important;
  }
  .workflow-item.item-row>.workflow-required{
    width:64px!important;
    min-width:64px!important;
    height:62px!important;
    gap:2px!important;
    padding:1px!important;
  }
  .workflow-item.item-row>.workflow-required .required-title,
  .workflow-item.item-row>.workflow-required .required-state{font-size:8px!important}
  .workflow-item.item-row>.workflow-required>.item-required{
    width:28px!important;
    min-width:28px!important;
    height:15px!important;
    min-height:15px!important;
    flex-basis:15px!important;
  }
  .workflow-item.item-row>.workflow-content{
    grid-template-rows:34px 24px!important;
    gap:4px!important;
    height:62px!important;
  }
  .workflow-item .workflow-main-fields{
    grid-template-columns:minmax(210px,1.32fr) minmax(155px,.9fr) minmax(200px,1.14fr) minmax(185px,1.04fr)!important;
    gap:5px!important;
    height:34px!important;
  }
  .workflow-item .workflow-main-fields>label{
    height:34px!important;
    gap:1px!important;
    font-size:8px!important;
  }
  .workflow-item .workflow-main-fields>label>input,
  .workflow-item .workflow-main-fields>label>select{
    height:23px!important;
    min-height:23px!important;
    padding:2px 6px!important;
    font-size:9px!important;
    border-radius:3px!important;
  }
  .workflow-item .workflow-lower-band{
    grid-template-columns:minmax(0,1fr) minmax(175px,260px)!important;
    gap:6px!important;
    height:24px!important;
  }
  .workflow-item .workflow-lower-band>.workflow-notes{
    grid-template-columns:12px 34px minmax(0,1fr)!important;
    gap:3px!important;
    height:24px!important;
  }
  .workflow-item .workflow-notes>.notes-icon,
  .workflow-item .workflow-notes>.notes-title{font-size:8px!important}
  .workflow-item .workflow-notes>.item-notes{
    height:22px!important;
    min-height:22px!important;
    padding:2px 6px!important;
    font-size:9px!important;
    border-radius:3px!important;
  }
  .workflow-item .workflow-resource-actions{height:24px!important}
  .workflow-item .workflow-resource-actions>button:not(.hidden){
    height:22px!important;
    min-height:22px!important;
    padding:2px 6px!important;
    font-size:8px!important;
    border-radius:3px!important;
  }
  .workflow-item.item-row>.workflow-row-actions{
    grid-template-columns:29px 29px!important;
    grid-template-rows:29px 29px!important;
    gap:4px 5px!important;
    width:63px!important;
    min-width:63px!important;
    height:62px!important;
  }
  .workflow-item.item-row>.workflow-row-actions>.item-up,
  .workflow-item.item-row>.workflow-row-actions>.item-down{
    width:29px!important;
    min-width:29px!important;
    height:29px!important;
    min-height:29px!important;
  }
  .workflow-item.item-row>.workflow-row-actions>.item-remove{
    width:29px!important;
    min-width:29px!important;
    height:62px!important;
    min-height:62px!important;
  }
  .workflow-item.item-row>.workflow-row-actions>.item-up>span,
  .workflow-item.item-row>.workflow-row-actions>.item-down>span{font-size:15px!important}
  .workflow-item.item-row>.workflow-row-actions>.item-remove>.trash-icon{width:14px!important;height:14px!important}
}

@media(max-width:1100px){
  #portalView:not(.hidden){padding-top:160px!important}
  #portalView:not(.hidden)>.page:not(.hidden){height:calc(100vh - 195px)!important}
}

/* ============================================================
   CONTAINED ACTION BAR + GENTLE ROW SPACING — REPAIR 12
   Scope is deliberately limited to the two approved corrections.
   ============================================================ */
#programs>.card:first-child>p{
  position:relative!important;
  bottom:auto!important;
  z-index:auto!important;
  margin:7px 0 0!important;
}

@media(min-width:1101px){
  #items{gap:5px!important}
  .workflow-item.item-row{
    grid-template-rows:70px!important;
    min-height:78px!important;
    height:78px!important;
    padding-top:4px!important;
    padding-bottom:4px!important;
  }
  .workflow-item.item-row>.workflow-required,
  .workflow-item.item-row>.workflow-content,
  .workflow-item.item-row>.workflow-row-actions{
    height:70px!important;
  }
  .workflow-item.item-row>.workflow-content{
    grid-template-rows:36px 27px!important;
    gap:5px!important;
  }
  .workflow-item.item-row>.workflow-row-actions{
    grid-template-rows:33px 33px!important;
  }
  .workflow-item.item-row>.workflow-row-actions>.item-up,
  .workflow-item.item-row>.workflow-row-actions>.item-down{
    height:33px!important;
    min-height:33px!important;
  }
  .workflow-item.item-row>.workflow-row-actions>.item-remove{
    height:70px!important;
    min-height:70px!important;
  }
}

/* ============================================================
   NOTES SEPARATION + QUIET WINDOWS LAUNCH — REPAIR 13
   Visual scope: a clear gap between primary fields and Notes.
   ============================================================ */
@media(min-width:1101px){
  .workflow-item.item-row{
    grid-template-rows:76px!important;
    min-height:84px!important;
    height:84px!important;
  }
  .workflow-item.item-row>.workflow-required,
  .workflow-item.item-row>.workflow-content,
  .workflow-item.item-row>.workflow-row-actions{
    height:76px!important;
  }
  .workflow-item.item-row>.workflow-content{
    grid-template-rows:36px 29px!important;
    gap:8px!important;
  }
  .workflow-item .workflow-lower-band,
  .workflow-item .workflow-lower-band>.workflow-notes,
  .workflow-item .workflow-resource-actions{
    height:29px!important;
  }
  .workflow-item .workflow-notes>.item-notes,
  .workflow-item .workflow-resource-actions>button:not(.hidden){
    height:25px!important;
    min-height:25px!important;
  }
  .workflow-item.item-row>.workflow-row-actions{
    grid-template-rows:36px 36px!important;
  }
  .workflow-item.item-row>.workflow-row-actions>.item-up,
  .workflow-item.item-row>.workflow-row-actions>.item-down{
    height:36px!important;
    min-height:36px!important;
  }
  .workflow-item.item-row>.workflow-row-actions>.item-remove{
    height:76px!important;
    min-height:76px!important;
  }
}

/* ============================================================
   PERSONNEL EDIT + READABLE ROW LABELS — REPAIR 14
   ============================================================ */
.personnel-actions{display:flex!important;align-items:center!important;gap:6px!important;flex-wrap:wrap!important}

@media(min-width:1101px){
  .workflow-item.item-row{
    grid-template-rows:80px!important;
    min-height:88px!important;
    height:88px!important;
  }
  .workflow-item.item-row>.workflow-required,
  .workflow-item.item-row>.workflow-content,
  .workflow-item.item-row>.workflow-row-actions{height:80px!important}
  .workflow-item.item-row>.workflow-content{
    grid-template-rows:36px 31px!important;
    gap:10px!important;
  }
  .workflow-item .workflow-lower-band,
  .workflow-item .workflow-lower-band>.workflow-notes,
  .workflow-item .workflow-resource-actions{height:31px!important}
  .workflow-item .workflow-notes>.item-notes,
  .workflow-item .workflow-resource-actions>button:not(.hidden){height:27px!important;min-height:27px!important}
  .workflow-item.item-row>.workflow-required .required-title,
  .workflow-item.item-row>.workflow-required .required-state,
  .workflow-item .workflow-notes>.notes-icon,
  .workflow-item .workflow-notes>.notes-title{font-size:11px!important;line-height:1.15!important}
  .workflow-item.item-row>.workflow-row-actions{grid-template-rows:38px 38px!important}
  .workflow-item.item-row>.workflow-row-actions>.item-up,
  .workflow-item.item-row>.workflow-row-actions>.item-down{height:38px!important;min-height:38px!important}
  .workflow-item.item-row>.workflow-row-actions>.item-remove{height:80px!important;min-height:80px!important}
}

/* ============================================================
   CONTAINED RESOURCE PICKERS — REPAIR 15
   An open selector becomes a real second row in the item grid.
   The following program item is therefore moved down instead of
   painting over the selector or its preview.
   ============================================================ */
.workflow-item.item-row>.scripture-picker,
.workflow-item.item-row>.hymn-picker,
.workflow-item.item-row>.worship-resource-picker,
.workflow-item.item-row>.saved-scripture-summary,
.workflow-item.item-row>.saved-hymn-summary,
.workflow-item.item-row>.saved-worship-resource-summary{
  position:relative!important;
  z-index:1!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
}

@media(min-width:1101px){
  .workflow-item.item-row:has(>.scripture-picker),
  .workflow-item.item-row:has(>.hymn-picker),
  .workflow-item.item-row:has(>.worship-resource-picker),
  .workflow-item.item-row:has(>.saved-scripture-summary),
  .workflow-item.item-row:has(>.saved-hymn-summary),
  .workflow-item.item-row:has(>.saved-worship-resource-summary){
    grid-template-rows:80px auto!important;
    row-gap:10px!important;
    height:auto!important;
    min-height:88px!important;
    overflow:visible!important;
  }
  .workflow-item.item-row>.scripture-picker,
  .workflow-item.item-row>.hymn-picker,
  .workflow-item.item-row>.worship-resource-picker,
  .workflow-item.item-row>.saved-scripture-summary,
  .workflow-item.item-row>.saved-hymn-summary,
  .workflow-item.item-row>.saved-worship-resource-summary{
    grid-column:1/-1!important;
    grid-row:auto!important;
    align-self:start!important;
    justify-self:stretch!important;
    margin:0!important;
  }
}
