.locker-section {
  padding: 34px 0 54px;
}

.locker-heading {
  align-items: flex-end;
  gap: 24px;
}

.locker-summary {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.locker-summary span {
  display: grid;
  min-width: 108px;
  padding: 12px 16px;
  border: 1px solid #d8e3de;
  border-radius: 14px;
  background: #fff;
  color: #52655f;
}

.locker-summary strong {
  font-size: 1.45rem;
  color: #153d36;
}

.locker-callout {
  display: flex;
  gap: 10px;
  margin: 18px 0 22px;
  padding: 16px 18px;
  border-left: 5px solid #078b63;
  border-radius: 12px;
  background: #e9f6f1;
  color: #234b43;
}

.locker-layout {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap: 22px;
  align-items: start;
}

.locker-form,
.locker-library {
  padding: 22px;
  border: 1px solid #dce5e1;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 14px 32px rgba(22, 60, 52, .06);
}

.locker-form-head,
.locker-library-head,
.locker-actions,
.locker-card-head,
.locker-card-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.locker-form h3,
.locker-library h3 {
  margin: 3px 0 0;
}

.locker-form > label,
.locker-two-cols > label,
.locker-form fieldset {
  display: grid;
  gap: 7px;
  margin: 15px 0 0;
  color: #274b44;
  font-weight: 700;
}

.locker-form input,
.locker-form select,
.locker-form textarea,
.locker-filters input,
.locker-filters select {
  width: 100%;
  box-sizing: border-box;
  padding: 11px 12px;
  border: 1px solid #bdcec8;
  border-radius: 10px;
  background: #fff;
  color: #173b35;
  font: inherit;
}

.locker-form textarea {
  resize: vertical;
  line-height: 1.45;
}

.locker-form input:focus,
.locker-form select:focus,
.locker-form textarea:focus,
.locker-filters input:focus,
.locker-filters select:focus {
  outline: 3px solid rgba(7, 139, 99, .18);
  border-color: #078b63;
}

.locker-two-cols {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.locker-form fieldset {
  padding: 14px;
  border: 1px solid #dce5e1;
  border-radius: 12px;
}

.locker-form legend {
  padding: 0 6px;
}

.locker-form legend small {
  font-weight: 400;
  color: #647a74;
}

.locker-check-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.locker-check-grid label,
.locker-featured {
  display: flex !important;
  grid-template-columns: none !important;
  align-items: center;
  gap: 8px;
  margin: 0 !important;
  padding: 9px 10px;
  border-radius: 9px;
  background: #f3f7f5;
  font-weight: 600 !important;
}

.locker-check-grid input,
.locker-featured input {
  width: auto;
}

.locker-featured {
  margin-top: 15px !important;
}

.locker-actions {
  margin-top: 18px;
  justify-content: flex-start;
}

.locker-filters {
  display: grid;
  grid-template-columns: minmax(170px, 1fr) 150px 120px;
  gap: 8px;
  margin: 16px 0 8px;
}

.locker-status {
  min-height: 22px;
  color: #637872;
}

.locker-list {
  display: grid;
  gap: 12px;
}

.locker-card {
  padding: 17px;
  border: 1px solid #dce5e1;
  border-radius: 14px;
  background: #fdfefe;
}

.locker-card[data-status="draft"] {
  border-left: 5px solid #d69b19;
}

.locker-card[data-status="published"] {
  border-left: 5px solid #078b63;
}

.locker-card[data-status="archived"] {
  border-left: 5px solid #899792;
  opacity: .78;
}

.locker-card h4 {
  margin: 4px 0 5px;
  color: #173b35;
  font-size: 1.08rem;
}

.locker-card p {
  margin: 8px 0;
  color: #536a64;
  line-height: 1.45;
}

.locker-card-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.locker-chip {
  display: inline-flex;
  align-items: center;
  padding: 5px 8px;
  border-radius: 999px;
  background: #eaf2ef;
  color: #285149;
  font-size: .76rem;
  font-weight: 700;
}

.locker-chip.published { background: #dff4ea; color: #086c4e; }
.locker-chip.draft { background: #fff1cc; color: #8a5a00; }
.locker-chip.archived { background: #e9edeb; color: #61706b; }
.locker-chip.featured { background: #e8e0f7; color: #66479d; }

.locker-card-meta {
  color: #72837e;
  font-size: .82rem;
}

.locker-card-actions {
  justify-content: flex-start;
  flex-wrap: wrap;
  margin-top: 12px;
}

.locker-empty {
  padding: 30px 20px;
  border: 1px dashed #b9cbc5;
  border-radius: 14px;
  text-align: center;
  color: #637872;
  background: #f7faf9;
}

@media (max-width: 980px) {
  .locker-layout { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
  .locker-heading,
  .locker-callout,
  .locker-form-head,
  .locker-library-head { align-items: stretch; flex-direction: column; }
  .locker-two-cols,
  .locker-filters { grid-template-columns: 1fr; }
  .locker-check-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .locker-form,
  .locker-library { padding: 16px; }
}