/* =========================================================
   DBM UPDATE – BASE LAYOUT (SAFE)
   Scoped strictly to Update Dashboard
   ========================================================= */

.dbm-wrap-public{
  color:#111;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
}

.dbm-update-page{
  background:#fff;
}

/* ================= Dashboard Container ================= */

.dbm-update-dashboard{
  max-width:1200px;
  margin:0 auto;
  padding:24px 16px 56px;
}

/* ================= Header ================= */

.dbm-update-dashboard .dbm-upd-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:16px;
}

.dbm-update-dashboard .dbm-upd-h{
  margin:0;
  font-size:22px;
  font-weight:900;
  letter-spacing:.2px;
}

.dbm-update-dashboard .dbm-upd-subh{
  margin:6px 0 0;
  font-size:13px;
  color:rgba(0,0,0,.60);
  line-height:1.35;
}

.dbm-update-dashboard .dbm-upd-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(212,175,55,.10);
  border:1px solid rgba(212,175,55,.35);
  color:#111;
  font-size:12px;
  font-weight:900;
}

/* ================= Layout ================= */

.dbm-update-dashboard .dbm-upd-layout{
  display:flex;
  gap:18px;
  align-items:flex-start;
}

.dbm-update-dashboard .dbm-upd-left{
  width:420px;
  min-width:360px;
}

.dbm-update-dashboard .dbm-upd-right{
  flex:1;
  min-width:320px;
}

@media (max-width:1060px){
  .dbm-update-dashboard .dbm-upd-layout{
    flex-wrap:wrap;
  }
  .dbm-update-dashboard .dbm-upd-left,
  .dbm-update-dashboard .dbm-upd-right{
    width:100%;
    min-width:0;
  }
}

/* =========================================================
   DBM UPDATE – CARD SYSTEM (PHASE 3 FINAL)
   ========================================================= */

.dbm-update-dashboard .dbm-card{
  background:#fff;
  border:1px solid rgba(212,175,55,.35);
  border-radius:14px;
  box-shadow:0 10px 30px rgba(0,0,0,.06);
  overflow:hidden;
  transition:border-color .25s ease, box-shadow .25s ease;
}

.dbm-update-dashboard .dbm-card + .dbm-card{
  margin-top:18px;
}

.dbm-update-dashboard .dbm-card:hover{
  border-color:rgba(212,175,55,.6);
  box-shadow:0 12px 32px rgba(0,0,0,.08);
}

/* ================= Card Header ================= */

.dbm-update-dashboard .dbm-card-hd,
.dbm-update-dashboard .dbm-card__top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:14px 16px;
  background:linear-gradient(135deg,#0b0b0b,#1a1a1a);
  color:#d4af37;
  border-bottom:1px solid rgba(212,175,55,.25);
}

.dbm-update-dashboard .dbm-card-hd h3,
.dbm-update-dashboard .dbm-card-hd h4,
.dbm-update-dashboard .dbm-card__title{
  margin:0;
  font-size:13px;
  font-weight:900;
  letter-spacing:.3px;
}

/* ================= Card Body ================= */

.dbm-update-dashboard .dbm-card-bd,
.dbm-update-dashboard .dbm-card__body{
  padding:16px;
  transition:
    max-height .35s ease,
    opacity .25s ease,
    padding .25s ease;
}

/* ================= Collapse Animation ================= */

.dbm-update-dashboard .dbm-card.is-collapsed .dbm-card-bd,
.dbm-update-dashboard .dbm-card.is-collapsed .dbm-card__body{
  max-height:0;
  opacity:0;
  padding-top:0;
  padding-bottom:0;
  overflow:hidden;
}

.dbm-update-dashboard .dbm-card:not(.is-collapsed) .dbm-card-bd{
  max-height:2000px;
  opacity:1;
}

/* ================= Editing State ================= */

.dbm-update-dashboard .dbm-card.is-edit{
  border-color:#d4af37;
  box-shadow:0 0 0 2px rgba(212,175,55,.25);
}

.dbm-update-dashboard .dbm-card.is-edit .dbm-card-hd{
  background:linear-gradient(135deg,#1a1a1a,#2a2a2a);
}

/* ================= Fields ================= */

.dbm-update-dashboard .dbm-field label{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:12px;
  font-weight:900;
  margin-bottom:6px;
}

.dbm-update-dashboard .dbm-field input,
.dbm-update-dashboard .dbm-field select,
.dbm-update-dashboard .dbm-field textarea{
  width:100%;
  border:1px solid rgba(0,0,0,.10);
  border-radius:12px;
  padding:11px 12px;
  font-size:14px;
  transition:border-color .12s ease, box-shadow .12s ease;
}

.dbm-update-dashboard .dbm-field textarea{
  min-height:92px;
  resize:vertical;
}

.dbm-update-dashboard .dbm-field input:focus,
.dbm-update-dashboard .dbm-field select:focus,
.dbm-update-dashboard .dbm-field textarea:focus{
  border-color:rgba(212,175,55,.7);
  box-shadow:0 0 0 4px rgba(212,175,55,.16);
  outline:none;
}

/* ================= Grid ================= */

.dbm-update-dashboard .dbm-grid-2{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}

.dbm-update-dashboard .dbm-grid-2 > .dbm-field{
  width:calc(50% - 6px);
}

.dbm-update-dashboard .dbm-grid-span-2{
  width:100% !important;
}

@media (max-width:520px){
  .dbm-update-dashboard .dbm-grid-2 > .dbm-field{
    width:100%;
  }
}

/* ================= Buttons ================= */

.dbm-update-dashboard .dbm-btn,
.dbm-update-dashboard .dbm-actions button{
  appearance:none;
  background:transparent;
  border:1px solid rgba(212,175,55,.6);
  color:#d4af37;
  border-radius:999px;
  padding:6px 14px;
  font-size:12px;
  font-weight:900;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:8px;
  transition:all .2s ease;
}

.dbm-update-dashboard .dbm-btn:hover,
.dbm-update-dashboard .dbm-actions button:hover{
  background:#d4af37;
  color:#0b0b0b;
}

.dbm-update-dashboard .dbm-btn-gold{
  background:#d4af37;
  color:#0b0b0b;
  border-color:#d4af37;
}

/* ================= Collapse Toggle ================= */

.dbm-update-dashboard .dbm-collapse-toggle{
  background:transparent;
  border:0;
  padding:6px 10px;
  border-radius:10px;
  font-size:12px;
  font-weight:900;
  cursor:pointer;
}

.dbm-update-dashboard .dbm-collapse-caret{
  width:10px;
  height:10px;
  display:inline-block;
  transition:transform .15s ease;
}

.dbm-update-dashboard .dbm-card.is-collapsed .dbm-collapse-caret{
  transform:rotate(-90deg);
}

/* ================= Saved Badge ================= */

.dbm-update-dashboard [data-saved]{
  background:rgba(212,175,55,.15);
  color:#8a6d1d;
  border:1px solid rgba(212,175,55,.4);
  border-radius:999px;
  padding:4px 10px;
  font-size:12px;
  font-weight:900;
}

/* ================= Muted ================= */

.dbm-update-dashboard .dbm-muted{
  font-size:11px;
  color:rgba(0,0,0,.55);
  margin-top:8px;
}

/* ===============================
   DBM STEP COLLAPSE (PHASE 3)
   =============================== */

.dbm-step {
  display: none;
  animation: dbmFade .25s ease;
}

.dbm-step.is-active {
  display: block;
}

@keyframes dbmFade {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* =========================================================
   PHASE 4: Disable card "tools" on PUBLIC right sidebar
   ========================================================= */

/* If any old tools markup still exists, kill it only in right sidebar cards */
.dbm-right .dbm-card-tools,
.dbm-right .dbm-card__tools,
.dbm-right .dbm-tools,
.dbm-right .dbm-tools-row,
.dbm-right .dbm-card-actions,
.dbm-right .dbm-mini-tools {
  display: none !important;
}

/* Basic card layout (safe) */
.dbm-card {
  background: #fff;
  border: 1px solid rgba(212,175,55,.28);
  border-radius: 14px;
  box-shadow: 0 10px 25px rgba(0,0,0,.08);
  overflow: hidden;
}

.dbm-card__head {
  padding: 14px 16px;
  border-bottom: 1px solid rgba(212,175,55,.22);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.dbm-card__title {
  margin: 0;
  font-size: 14px;
  font-weight: 800;
  color: #111;
}

.dbm-card__body {
  padding: 14px 16px;
}

/* Summary rows */
.dbm-sum-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px dashed rgba(0,0,0,.10);
}

.dbm-hr {
  border: 0;
  height: 1px;
  background: rgba(0,0,0,.10);
  margin: 12px 0;
}

.dbm-sum-total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 16px;
}

.dbm-btn-block {
  width: 100%;
}

.dbm-upd-alert{
  border:1px solid rgba(212,175,55,.40);
  background: rgba(212,175,55,.08);
  color:#111;
  border-radius:12px;
  padding:10px 12px;
  margin-top:10px;
  font-weight:normal;
  line-height:1.35;
}
.dbm-upd-alert--warn{ border-color: rgba(212,175,55,.55); }
.dbm-upd-alert--ok{ border-color: rgba(0,0,0,.18); background: rgba(212,175,55,.10); }

/* DBM Alert (Gold/Black premium look) */
.dbm-alert{
  border:1px solid rgba(212,175,55,.45);
  background:rgba(212,175,55,.08);
  color:#111;
  border-radius:14px;
  padding:12px 14px;
  font-weight:700;
  display:flex;
  gap:10px;
  align-items:flex-start;
  box-shadow:0 10px 30px rgba(0,0,0,.06);
}
.dbm-alert::before{
  content:"!";
  width:22px;
  height:22px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#d4af37;
  color:#0b0b0b;
  font-weight:900;
  flex:0 0 22px;
  margin-top:1px;
}
.dbm-alert--error{
  border-color:rgba(160,0,0,.25);
  background:rgba(212,175,55,.07);
}
.dbm-alert--success{
  border-color:rgba(212,175,55,.55);
  background:rgba(212,175,55,.10);
}
.dbm-alert small{
  font-weight:600;
  color:rgba(0,0,0,.70);
}

/* when step2 active, hide the step1 intro block (adjust selector to your step1 wrapper) */
.dbm-step[data-pane="update"][data-step="2"].is-active ~ .dbm-step[data-step="1"] { display:none; }

/* full width dashboard */
.dbm-upd-layout{
  display:flex;
  align-items:flex-start;
  gap:24px;
}
.dbm-upd-left{
  flex:1;
  width:100%;
  max-width:100%;
}
.dbm-upd-right{
  display:none; /* hide right column */
}

/* =========================================================
   DBM Step 2 (Update Dashboard) — Card Header Gold Gradient
   Scope: ONLY update step 2 dashboard
   ========================================================= */

.dbm-step[data-pane="update"][data-step="2"] .dbm-upd-dashboard.dbm-upd-v2 .dbm-card .dbm-card__top{
  background: linear-gradient(135deg,#f7e39b 0%,#e6b94c 38%,#d4af37 68%,#b9891f 100%) !important;
  border-bottom: 1px solid rgba(0,0,0,.12) !important;
  box-shadow: none !important;
}

/* Title color on gold */
.dbm-step[data-pane="update"][data-step="2"] .dbm-upd-dashboard.dbm-upd-v2 .dbm-card .dbm-card__top .dbm-card__title{
  color: #0b0b0b !important;
  font-weight: 900 !important;
  letter-spacing: .2px !important;
}

/* Keep saved badge readable (if shown) */
.dbm-step[data-pane="update"][data-step="2"] .dbm-upd-dashboard.dbm-upd-v2 .dbm-card__saved{
  color:#0b0b0b !important;
  font-weight:800 !important;
}

/* Edit button: black bg + white text */
.dbm-step[data-pane="update"][data-step="2"] .dbm-upd-dashboard.dbm-upd-v2 .dbm-card .dbm-card__tools [data-edit]{
  background:#0b0b0b !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.15) !important;
  border-radius:10px !important;
  padding:6px 14px !important;
  font-weight:800 !important;
  line-height:1 !important;
  transition: background .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease !important;
}

/* Hover: white bg + gold text (your requirement) */
.dbm-step[data-pane="update"][data-step="2"] .dbm-upd-dashboard.dbm-upd-v2 .dbm-card .dbm-card__tools [data-edit]:hover{
  background:#fff !important;
  color:#41403b !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.18) !important;
}

/* Optional: make Save button match brand (only inside Step 2) */
.dbm-step[data-pane="update"][data-step="2"] .dbm-upd-dashboard.dbm-upd-v2 .dbm-card .dbm-card__tools [data-save]{
  background:#d4af37 !important;
  color:#0b0b0b !important;
  border:1px solid rgba(0,0,0,.15) !important;
  font-weight:900 !important;
  border-radius:10px !important;
}

/* Optional: Cancel button clean */
.dbm-step[data-pane="update"][data-step="2"] .dbm-upd-dashboard.dbm-upd-v2 .dbm-card .dbm-card__tools [data-cancel]{
  background:transparent !important;
  color:#0b0b0b !important;
  border:1px solid rgba(0,0,0,.25) !important;
  border-radius:10px !important;
}

/* =========================================================
   DBM Step 2 — Make card top "pill" + bigger title
   ========================================================= */

.dbm-step[data-pane="update"][data-step="2"] .dbm-upd-dashboard.dbm-upd-v2 .dbm-card{
  overflow: hidden !important; /* ensures pill corners clip clean */
  border-radius: 18px !important;
}

/* pill/curved header */
.dbm-step[data-pane="update"][data-step="2"] .dbm-upd-dashboard.dbm-upd-v2 .dbm-card .dbm-card__top{
  border-radius: 18px 18px 14px 14px !important; /* top pill, slight bottom curve */
  padding: 8px 16px !important;
}

/* bigger title */
.dbm-step[data-pane="update"][data-step="2"] .dbm-upd-dashboard.dbm-upd-v2 .dbm-card .dbm-card__top .dbm-card__title{
  font-size: 16px !important;   /* increase */
  font-weight: 900 !important;
  letter-spacing: .3px !important;
  line-height: 1.2 !important;
}

/* (optional) tighten tools alignment so it looks premium */
.dbm-step[data-pane="update"][data-step="2"] .dbm-upd-dashboard.dbm-upd-v2 .dbm-card .dbm-card__tools{
  gap: 8px !important;
}

/* =========================================================
   DBM Step 2 — Card spacing (breathing space)
   ========================================================= */

.dbm-step[data-pane="update"][data-step="2"] 
.dbm-upd-dashboard.dbm-upd-v2 
.dbm-upd-left 
.dbm-card{
  margin-top: 20px !important;
  margin-bottom: 20px !important;
}

/* Remove extra space from first card */
.dbm-step[data-pane="update"][data-step="2"] 
.dbm-upd-dashboard.dbm-upd-v2 
.dbm-upd-left 
.dbm-card:first-child{
  margin-top: 0 !important;
}

/* Optional: slightly more spacing on right column cards */
.dbm-step[data-pane="update"][data-step="2"] 
.dbm-upd-dashboard.dbm-upd-v2 
.dbm-upd-right 
.dbm-card{
  margin-bottom: 20px !important;
}

/* Update flow: hide steps 2-4 until verified */
body:not(.dbm-upd-verified) .dbm-step[data-pane="update"][data-step="2"],
body:not(.dbm-upd-verified) .dbm-step[data-pane="update"][data-step="3"],
body:not(.dbm-upd-verified) .dbm-step[data-pane="update"][data-step="4"]{
  display:none !important;
}

.dbm-btn.is-disabled,
.dbm-btn:disabled{
  opacity: .55;
  cursor: not-allowed;
  pointer-events: none;
  filter: grayscale(20%);
}