/* Page Designer - Elementor Style */

.spb-float-btn{position:fixed;bottom:30px;right:30px;background:linear-gradient(135deg,#5c1a1a,#3d1212);color:#fff!important;padding:12px 24px;border-radius:30px;text-decoration:none!important;font-weight:bold;box-shadow:0 4px 15px rgba(0,0,0,0.3);z-index:9999;display:flex;align-items:center;gap:8px;cursor:pointer;transition:transform 0.2s;font-size:14px;}
.spb-float-btn:hover{transform:scale(1.05);}

.spb-toolbar{position:fixed;top:0;left:0;right:0;height:50px;background:#1a1a1a;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 20px;z-index:10001;box-shadow:0 2px 10px rgba(0,0,0,0.3);}
.spb-toolbar-left{display:flex;align-items:center;gap:10px;font-weight:bold;font-size:16px;}
.spb-toolbar-right{display:flex;gap:8px;}
.spb-logo{font-size:20px;}

.spb-btn{padding:8px 16px;border:none;border-radius:6px;cursor:pointer;font-size:13px;font-weight:500;transition:all 0.2s;background:#333;color:#fff;}
.spb-btn:hover{background:#444;}
.spb-btn:disabled{opacity:0.6;cursor:not-allowed;}
.spb-btn-save{background:#4caf50;}
.spb-btn-save:hover{background:#45a049;}
.spb-btn-exit{background:#c0392b;}
.spb-btn-exit:hover{background:#a93226;}

/* Left Panel */
.spb-panel{position:fixed;top:50px;left:0;width:260px;height:calc(100vh - 50px);background:#252525;color:#fff;z-index:10000;overflow-y:auto;box-shadow:2px 0 10px rgba(0,0,0,0.3);}
.spb-panel-header{padding:15px;border-bottom:1px solid #333;font-weight:bold;text-align:center;background:#1a1a1a;color:#d4a853;}
.spb-panel-body{padding:10px;}
.spb-category{margin-bottom:15px;}
.spb-category-title{padding:8px 12px;font-size:11px;font-weight:bold;color:#888;text-transform:uppercase;letter-spacing:1px;}
.spb-modules{display:flex;flex-direction:column;gap:6px;}
.spb-module-item{display:flex;align-items:center;gap:10px;padding:12px;background:#333;border-radius:8px;cursor:grab;transition:all 0.2s;border:2px solid transparent;}
.spb-module-item:hover{background:#3d3d3d;border-color:#d4a853;transform:translateX(5px);}
.spb-module-item.dragging{opacity:0.5;border-color:#4caf50;}
.spb-module-icon{font-size:18px;width:28px;text-align:center;}
.spb-module-name{font-size:13px;font-weight:500;}

body.spb-editing{padding-top:50px!important;}
body.spb-editing #mw-content-text{margin-left:260px;padding:20px;min-height:calc(100vh - 90px);background:#f0f0f0;}
body.spb-editing #mw-panel,body.spb-editing #p-logo{display:none;}

/* Canvas */
.spb-canvas{min-height:500px;background:#fff;border-radius:8px;padding:20px;box-shadow:0 2px 10px rgba(0,0,0,0.1);}
.spb-canvas.dragover{background:#f8f8f8;outline:3px dashed #d4a853;}
.spb-canvas-empty{text-align:center;padding:100px 40px;color:#999;font-size:18px;border:3px dashed #ddd;border-radius:8px;background:#fafafa;}

/* Blocks */
.spb-block{position:relative;margin-bottom:15px;border:2px solid transparent;border-radius:8px;transition:all 0.2s;background:#fff;}
.spb-block:hover{border-color:#d4a853;box-shadow:0 4px 15px rgba(0,0,0,0.1);}
.spb-block.dragging-block{opacity:0.5;border-color:#4caf50;}

.spb-block-controls{position:absolute;top:-12px;right:10px;display:none;gap:5px;z-index:10;}
.spb-block:hover .spb-block-controls{display:flex;}
.spb-block-del{background:#e74c3c;color:#fff;border:none;border-radius:50%;width:28px;height:28px;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 5px rgba(0,0,0,0.2);}
.spb-block-del:hover{background:#c0392b;transform:scale(1.1);}

/* Row/Columns */
.spb-row{display:flex;gap:15px;}
.spb-col{flex:1;min-height:80px;padding:15px;background:#f9f9f9;border:1px dashed #ccc;border-radius:6px;outline:none;}
.spb-col:focus{border-color:#5c1a1a;border-style:solid;background:#fff;}
.spb-col.spb-sidebar{flex:0 0 30%;background:#f0f0f0;}
.spb-col.spb-main{flex:0 0 calc(70% - 15px);}

/* Text Block */
.spb-text{padding:20px;min-height:60px;outline:none;line-height:1.6;font-size:15px;}
.spb-text:focus{background:#fffbf0;}
.spb-text:empty:before{content:"Click to edit text...";color:#999;}

/* Heading */
.spb-heading{padding:15px 20px;margin:0;outline:none;border-bottom:2px solid #eee;}
.spb-heading:focus{background:#fffbf0;border-bottom-color:#5c1a1a;}
.spb-subheading{padding:12px 20px;margin:0;outline:none;font-size:1.2em;color:#444;}
.spb-subheading:focus{background:#fffbf0;}

/* Image Block */
.spb-image-block{padding:20px;text-align:center;}
.spb-image-placeholder{padding:40px;background:#f5f5f5;border:2px dashed #ddd;border-radius:8px;color:#666;font-size:48px;margin-bottom:10px;}
.spb-image-input,.spb-image-caption{margin-top:8px;padding:10px;border:1px solid #ddd;border-radius:6px;width:250px;text-align:center;display:block;margin-left:auto;margin-right:auto;}

/* Profile Block */
.spb-profile-block{padding:40px;text-align:center;background:linear-gradient(135deg,#f5f5f5,#eee);border-radius:8px;font-size:18px;color:#666;}
.spb-profile-block small{display:block;margin-top:8px;font-size:12px;color:#999;}

/* Quote Block */
.spb-quote-block{border-left:4px solid #d4a853;padding:20px;margin:10px;background:#faf8f5;}
.spb-quote-text{font-style:italic;font-size:16px;outline:none;min-height:40px;}
.spb-quote-text:focus{background:#fff;}
.spb-quote-author{margin-top:10px;color:#666;outline:none;}
.spb-quote-author:focus{background:#fff;}

/* Info Box */
.spb-infobox{background:#e3f2fd;border-left:4px solid #2196f3;padding:15px;margin:10px;border-radius:0 8px 8px 0;}
.spb-infobox [contenteditable]{outline:none;display:inline;}
.spb-infobox [contenteditable]:focus{background:#fff;padding:2px 5px;border-radius:3px;}

/* Tabs Block */
.spb-tabs-block{border:1px solid #ddd;border-radius:8px;overflow:hidden;margin:10px;}
.spb-tabs-header{display:flex;background:#f5f5f5;border-bottom:1px solid #ddd;}
.spb-tab-label{padding:12px 20px;outline:none;border-right:1px solid #ddd;cursor:text;}
.spb-tab-label:focus{background:#fff;}
.spb-tabs-content{padding:10px;}
.spb-tab-pane{padding:10px;outline:none;min-height:60px;border:1px dashed #eee;margin:5px;border-radius:4px;}
.spb-tab-pane:focus{border-color:#5c1a1a;background:#fffbf0;}

/* Collapse Block */
.spb-collapse-block{border:1px solid #ddd;border-radius:8px;overflow:hidden;margin:10px;}
.spb-collapse-header{background:#f5f5f5;padding:12px 15px;font-weight:bold;outline:none;}
.spb-collapse-header:focus{background:#eee;}
.spb-collapse-body{padding:15px;outline:none;min-height:60px;border-top:1px solid #ddd;}
.spb-collapse-body:focus{background:#fffbf0;}

/* Button Block */
.spb-button-block{padding:20px;text-align:center;}
.spb-btn-preview{display:inline-block;padding:12px 24px;background:#5c1a1a;color:#fff;border-radius:6px;font-weight:bold;cursor:text;outline:none;min-width:80px;}
.spb-btn-preview:focus{background:#3d1212;}
.spb-btn-link{margin-top:10px;padding:8px 12px;border:1px solid #ddd;border-radius:6px;width:250px;text-align:center;display:block;margin-left:auto;margin-right:auto;}

/* Links Block */
.spb-links-block{padding:15px;}
.spb-link-item{display:flex;gap:10px;margin-bottom:8px;}
.spb-link-text,.spb-link-url{flex:1;padding:8px 12px;border:1px solid #ddd;border-radius:6px;}

/* Gallery Block */
.spb-gallery-block{padding:20px;text-align:center;}
.spb-gallery-preview{padding:30px;background:#f5f5f5;border:2px dashed #ddd;border-radius:8px;color:#666;font-size:32px;margin-bottom:10px;}
.spb-gallery-input{width:100%;max-width:400px;height:100px;padding:10px;border:1px solid #ddd;border-radius:6px;font-family:monospace;font-size:12px;}

/* Video Block */
.spb-video-block{padding:20px;text-align:center;}
.spb-video-preview{padding:40px;background:#000;color:#fff;border-radius:8px;font-size:48px;margin-bottom:10px;}
.spb-video-input{padding:10px;border:1px solid #ddd;border-radius:6px;width:250px;text-align:center;}

/* Divider */
.spb-block .spb-divider{border:none;border-top:2px solid #ddd;margin:20px;}

/* Spacer */
.spb-spacer-block{padding:20px;text-align:center;background:#f9f9f9;color:#999;font-size:24px;border:1px dashed #ddd;border-radius:8px;margin:10px;}

/* Box */
.spb-box{border:1px solid #ddd;border-radius:8px;overflow:hidden;margin:10px;}
.spb-box-title{background:#5c1a1a;color:#fff;padding:15px;font-weight:bold;outline:none;}
.spb-box-title:focus{background:#3d1212;}
.spb-box-content{padding:15px;outline:none;min-height:60px;}
.spb-box-content:focus{background:#fffbf0;}

/* Alert/Success */
.spb-alert-block{background:#fff3e0;border:1px solid #ffcc80;padding:15px;border-radius:8px;margin:10px;}
.spb-alert-block [contenteditable]{outline:none;}
.spb-alert-block [contenteditable]:focus{background:#fff;padding:2px 5px;border-radius:3px;}
.spb-success-block{background:#e8f5e9;border:1px solid #a5d6a7;padding:15px;border-radius:8px;margin:10px;}
.spb-success-block [contenteditable]{outline:none;}
.spb-success-block [contenteditable]:focus{background:#fff;padding:2px 5px;border-radius:3px;}

/* Responsive */
@media(max-width:900px){
    .spb-panel{width:200px;}
    body.spb-editing #mw-content-text{margin-left:200px;}
}
@media(max-width:768px){
    .spb-panel{width:100%;height:auto;max-height:40vh;top:auto;bottom:0;}
    .spb-panel-body{display:flex;flex-wrap:wrap;gap:8px;}
    .spb-module-item{flex:0 0 auto;padding:10px;}
    body.spb-editing #mw-content-text{margin-left:0;margin-bottom:40vh;}
    .spb-row{flex-direction:column;}
}