/* Wrapper */
.gdv-wrapper{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial;max-width:1180px;margin:0 auto;padding:24px}
.gdv-title{font-size:36px;margin:0 0 8px}
.gdv-sub{color:#555;margin:0 0 20px}

/* Steps visibility */
.gdv-steps .gdv-step{display:none}
.gdv-steps .gdv-step.is-active{display:block}

/* Head/body spacing */
.gdv-step-head{margin:8px 0 14px}
.gdv-step-body{margin-top:6px}
.gdv-step-actions{margin-top:12px;text-align:right}

/* Grid + cards */
.gdv-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:24px}
@media (max-width:980px){.gdv-grid-2{grid-template-columns:1fr}}
.gdv-card{background:#f3f4f7;border-radius:10px;padding:20px}
.gdv-card h3{margin-top:0}

/* Buttons */
.gdv-btn{background:#f45b1e;color:#fff;border:none;border-radius:8px;padding:12px 18px;cursor:pointer}
.gdv-btn[disabled]{opacity:.5;cursor:not-allowed}
.gdv-btn.outline{background:#fff;color:#f45b1e;border:1px solid #f45b1e}
.gdv-btn.link{background:#eef3ff;color:#f45b1e}

/* Inline gallery (Step 1) */
.gdv-lib-inline{margin-top:18px}
.gdv-library-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.gdv-library-grid img{width:100%;height:160px;object-fit:cover;border-radius:8px;border:2px solid transparent;cursor:pointer}
.gdv-library-grid img:hover{border-color:#f45b1e}
@media (max-width:900px){.gdv-library-grid{grid-template-columns:repeat(2,1fr)}}

/* Utility */
.is-hidden{display:none!important}

/* Canvas area */
.gdv-canvas-wrap{background:#fff;border:1px solid #e5e7eb;border-radius:10px;min-height:400px;padding:10px}
.gdv-canvas{position:relative;min-height:380px;display:flex;align-items:center;justify-content:center;overflow:hidden}
#gdv-house{max-width:100%;max-height:520px;display:none}
#gdv-door{position:absolute;top:40%;left:40%;width:240px;display:none;pointer-events:auto;cursor:move}
.gdv-help{color:#c62828;margin:8px 0 0}

/* (If you later switch back to multi-layer door, these are ready) */
#gdv-door-wrap{position:absolute;top:40%;left:40%;width:240px;height:auto;display:none;transform:translate(0,0);pointer-events:auto;cursor:move}
#gdv-door-base,#gdv-door-insert,#gdv-door-tint{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#gdv-door-base{z-index:10}
#gdv-door-tint{z-index:11;mix-blend-mode:multiply;opacity:.85;background-size:cover;background-position:center}
#gdv-door-insert{z-index:12}

/* Controls / accordion */
.gdv-controls{background:#f6f9ff;border-radius:10px;padding:16px}
.gdv-accordion .gdv-acc-item{background:#fff;border-radius:10px;margin-bottom:12px;overflow:hidden;border:1px solid #e5e7eb}
.gdv-acc-toggle{width:100%;text-align:left;padding:14px 16px;border:none;background:#fff;font-weight:600;cursor:pointer;color:#000 !important;}
.gdv-acc-item.is-open .gdv-acc-panel{display:block}
.gdv-acc-panel{display:none;padding:12px 16px;border-top:1px solid #e5e7eb}

/* Options grids */
.gdv-card-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.gdv-card-grid.small{grid-template-columns:repeat(4,1fr)}
.gdv-card-grid .opt,.gdv-swatch-grid .opt{background:#f3f4f7;border-radius:8px;padding:8px;cursor:pointer;border:2px solid transparent;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.opt.is-selected{border-color:#f45b1e}

.gdv-swatch-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.gdv-swatch{width:100%;height:56px;border-radius:6px;border:1px solid #d9dce2;background-size:cover;background-position:center}

/* Footer row */
.gdv-rows{display:flex;gap:10px;margin-top:16px}

/* Summary list */
#gdv-summary .gdv-summary-item{display:flex;gap:14px;align-items:center;margin:10px 0;padding:10px;background:#f7f7f8;border-radius:8px}


/* keep canvas below sidebar and clip overlay */
.gdv-canvas-wrap, .gdv-canvas { position:relative; z-index:1; overflow:hidden; }

/* door wrapper is the drag/resize target */
#gdv-door-wrap{
  position:absolute; left:40%; top:40%;
  width:240px; height:auto; display:none;
  transform:none; cursor:move; z-index:2;
}

/* three layers fill the wrapper */
#gdv-door-base, #gdv-door-tint, #gdv-door-insert{
  position:absolute; inset:0; width:100%; height:100%; pointer-events:none;
}
#gdv-door-tint{
  mix-blend-mode:multiply; opacity:.85;      /* solid color tint */
  background-size:cover; background-position:center;
}
/* Insert Layer Fix */
#gdv-insert-layer {
  position: absolute;
  inset: 0;                     /* cover door area */
  pointer-events: none;
  z-index: 3;
  opacity: 0.9;
  background-repeat: repeat-x;  /* tile horizontally */
  background-position: top;     /* align to top of panel */
  background-size: auto 100%;   /* height matches door, width auto repeat */
}


/* sidebar must stay above the canvas */
.gdv-controls{ position:relative; z-index:10; }

/* accordion visibility (if not already present) */
.gdv-acc-panel{display:none;}
.gdv-acc-item.is-open .gdv-acc-panel{display:block;}