@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700&family=Cinzel+Decorative:wght@700&family=Playfair+Display:wght@600;700&family=Cormorant+Garamond:wght@500;600;700&family=Cormorant:wght@600&family=EB+Garamond:wght@500;600&family=Crimson+Text:wght@600&family=Libre+Baskerville:wght@700&family=Merriweather:wght@700&family=Lora:wght@600&family=PT+Serif:wght@700&family=Marcellus&family=Italiana&family=IM+Fell+English&family=UnifrakturMaguntia&family=Great+Vibes&family=Dancing+Script:wght@600&family=Pacifico&family=Alex+Brush&family=Tangerine:wght@700&family=Sacramento&family=Parisienne&family=Pinyon+Script&family=Josefin+Sans:wght@600&family=Montserrat:wght@700&family=Oswald:wght@600&family=Bebas+Neue&display=swap');


.virolas-editor{
  --bg:#2c2233;
  --panel:#3a2c46;
  --panel2:#443552;
  --line:#5f4c6d;
  --brass:#AB89C6;
  --brass-soft:#76558F;
  --text:#F8F2FB;
  --text-dim:#C9B7D6;
  --danger:#B85C6B;
}.virolas-editor *{box-sizing:border-box;}.virolas-editor{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:'EB Garamond', Georgia, serif;height:100%;}.virolas-editor h1, .virolas-editor h2, .virolas-editor h3{font-family:'Cinzel', serif;font-weight:600;letter-spacing:.02em;margin:0 0 4px 0;}.virolas-editor .app{display:flex;height:100vh;}.virolas-editor .panel{width:400px;min-width:360px;background:var(--panel);border-right:1px solid var(--line);overflow-y:auto;padding:22px 20px 60px;}.virolas-editor .stage{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:28px;overflow:auto;background:
  radial-gradient(ellipse at 50% 0%, #3d2f49 0%, #201826 70%);}.virolas-editor .title{font-size:19px;color:var(--brass);margin-bottom:2px;}.virolas-editor .subtitle{color:var(--text-dim);font-size:14px;margin-bottom:22px;}.virolas-editor .section{margin-bottom:26px;padding-bottom:20px;border-bottom:1px solid var(--line);}.virolas-editor .section:last-child{border-bottom:none;}.virolas-editor .section-header{cursor:pointer;user-select:none;display:flex;align-items:center;justify-content:space-between;margin:0 0 4px 0;}.virolas-editor .section-header:hover{color:var(--brass);}.virolas-editor .section-chevron{font-size:11px;color:var(--text-dim);transition:transform .15s;margin-left:8px;}.virolas-editor .section.collapsed .section-body{display:none;}.virolas-editor .section.collapsed .section-chevron{transform:rotate(-90deg);}.virolas-editor .section h3{font-size:14px;text-transform:uppercase;letter-spacing:.12em;color:var(--brass);margin-bottom:12px;}.virolas-editor label{display:block;font-size:13px;color:var(--text-dim);margin:10px 0 4px;}.virolas-editor input[type=text], .virolas-editor input[type=number], .virolas-editor select{
  width:100%;padding:8px 10px;background:var(--panel2);border:1px solid var(--line);color:var(--text);
  border-radius:3px;font-family:inherit;font-size:15px;
}.virolas-editor input[type=range]{width:100%;accent-color:var(--brass);}.virolas-editor .row{display:flex;gap:10px;}.virolas-editor .row > div{flex:1;}.virolas-editor button{
  font-family:'Cinzel',serif;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;
  background:var(--brass-soft);color:var(--text);border:none;padding:9px 12px;border-radius:3px;cursor:pointer;
}.virolas-editor button:hover{background:var(--brass);color:#2c2233;}.virolas-editor button.ghost{background:transparent;border:1px solid var(--line);color:var(--text);}.virolas-editor button.ghost:hover{border-color:var(--brass);color:var(--brass);}.virolas-editor button.danger{background:transparent;border:1px solid var(--danger);color:var(--danger);}.virolas-editor button.danger:hover{background:var(--danger);color:#fff;}.virolas-editor button:disabled{opacity:.4;cursor:not-allowed;}.virolas-editor button.small{font-size:11px;padding:5px 8px;}.virolas-editor .btnrow{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;}.virolas-editor .slot{background:var(--panel2);border:1px solid var(--line);border-radius:5px;padding:12px;margin-bottom:12px;}.virolas-editor .slot.active{border-color:var(--brass);}.virolas-editor .slot-head{display:flex;align-items:center;gap:10px;margin-bottom:8px;}.virolas-editor .thumb{width:44px;height:44px;border-radius:4px;object-fit:cover;background:#141312;border:1px solid var(--line);cursor:pointer;}.virolas-editor .slot-name{font-size:13px;color:var(--text);flex:1;}.virolas-editor .small{font-size:11.5px;color:var(--text-dim);}.virolas-editor .fileInput{display:none;}.virolas-editor .checkline{display:flex;align-items:center;gap:8px;margin:8px 0;}.virolas-editor .checkline input{accent-color:var(--brass);}.virolas-editor canvas{background:transparent;max-width:100%;image-rendering:crisp-edges;cursor:grab;height:auto!important;aspect-ratio:1/1;}.virolas-editor canvas:active{cursor:grabbing;}.virolas-editor #canvasWrap{position:relative;filter:drop-shadow(0 10px 30px rgba(0,0,0,.55));}.virolas-editor .bgcheck{
  background-image:
    linear-gradient(45deg,#2a2a2a 25%,transparent 25%),
    linear-gradient(-45deg,#2a2a2a 25%,transparent 25%),
    linear-gradient(45deg,transparent 75%,#2a2a2a 75%),
    linear-gradient(-45deg,transparent 75%,#2a2a2a 75%);
  background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0px;
  background-color:#241b2b; border-radius:50%;
}.virolas-editor .status{font-size:12px;color:var(--text-dim);min-height:16px;margin-top:8px;text-align:center;}.virolas-editor .projRow{display:flex;gap:8px;}.virolas-editor .projRow select{flex:1;}.virolas-editor .hint{font-size:12px;color:var(--text-dim);line-height:1.5;margin-top:6px;}.virolas-editor .slot-controls{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px;}.virolas-editor .slot-controls .full{grid-column:1/-1;}.virolas-editor .modeSwitch{display:flex;gap:8px;}.virolas-editor .modeSwitch button{flex:1;background:var(--panel2);color:var(--text-dim);border:1px solid var(--line);}.virolas-editor .modeSwitch button.on{background:var(--brass-soft);color:var(--text);border-color:var(--brass-soft);}.virolas-editor .freeItem{background:var(--panel2);border:1px solid var(--line);border-radius:5px;padding:10px;margin-bottom:10px;}.virolas-editor ::-webkit-scrollbar{width:10px;}.virolas-editor ::-webkit-scrollbar-thumb{background:#3a372f;border-radius:5px;}

/* ===================== Integración con el sitio DolceMora ===================== */

/* Esta versión es solo texto: se oculta la opción "Fotos con marco" y la opción
   "Fotos" de las zonas laterales, para que el cliente solo pueda diseñar con texto. */
.virolas-editor .modeSwitch button[data-mode="photos"] { display: none; }
.virolas-editor #sideMode option[value="photos"] { display: none; }

.virolas-editor-wrap {
    margin: 8px auto 48px;
}

.virolas-editor {
    border-radius: 28px;
    overflow: hidden;
    box-shadow: 0 16px 48px rgba(118, 85, 143, 0.25);
    height: auto;
}

.virolas-editor .app {
    height: 720px;
    max-height: 78vh;
}

.virolas-editor .precio-virola {
    font-size: 22px;
    font-weight: 700;
    color: var(--brass);
    margin: 4px 0 14px;
}

.virolas-editor .btn-agregar-virola {
    width: 100%;
    padding: 14px;
    font-size: 14px;
}

@media (max-width: 860px) {
    .virolas-editor .app {
        flex-direction: column;
        height: auto;
        max-height: none;
    }
    .virolas-editor .panel {
        width: 100%;
        min-width: 0;
        max-height: 60vh;
        border-right: none;
        border-bottom: 1px solid var(--line);
    }
    .virolas-editor .stage {
        min-height: 420px;
    }
}
