:root {
    --dw-bg: #f8fafc;
    --dw-card: #ffffff;
    --dw-text: #0f172a;
    --dw-text-mut: #64748b;
    --dw-border: #e2e8f0;
    --dw-primary: #2563eb;
    --dw-primary-hover: #1d4ed8;
    --dw-dev: #0f172a; /* Dark theme for developer buttons */
    --dw-radius: 20px;
    --dw-font: 'Inter', sans-serif;
}

.dw-case-wrapper { max-width: 1000px; margin: 60px auto; padding: 0 20px; font-family: var(--dw-font); box-sizing: border-box;}
.dw-case-wrapper * { box-sizing: border-box; }

.dw-case-card { background: var(--dw-card); border-radius: var(--dw-radius); padding: 40px; box-shadow: 0 20px 40px rgba(0,0,0,0.06), 0 40px 90px rgba(0,0,0,0.08); border: 1px solid var(--dw-border); transition: 0.3s; }
.dw-case-card:hover { transform: translateY(-4px); box-shadow: 0 25px 50px rgba(0,0,0,0.1); }

/* Header */
.dw-case-header { text-align: center; margin-bottom: 35px; }
.dw-badge { display: inline-block; background: #eff6ff; color: var(--dw-primary); padding: 6px 14px; border-radius: 20px; font-size: 12px; font-weight: 700; text-transform: uppercase; margin-bottom: 12px; letter-spacing: 0.5px;}
.dw-case-header h2 { font-size: 32px; font-weight: 800; color: var(--dw-text); margin: 0 0 10px 0; letter-spacing: -1px; }
.dw-case-header p { color: var(--dw-text-mut); font-size: 16px; margin: 0; }

/* Editor Container */
.dw-editor-container { border: 2px solid var(--dw-border); border-radius: 16px; overflow: hidden; margin-bottom: 30px; transition: 0.3s; background: var(--dw-bg); display: flex; flex-direction: column;}
.dw-editor-container:focus-within { border-color: var(--dw-primary); box-shadow: 0 0 0 4px rgba(37,99,235,0.1); background: #fff;}

textarea#dw_case_input { width: 100%; min-height: 250px; padding: 20px; border: none; font-size: 16px; font-family: var(--dw-font); line-height: 1.7; color: var(--dw-text); resize: vertical; outline: none; background: transparent; }

/* Status Bar */
.dw-status-bar { display: flex; align-items: center; padding: 10px 20px; background: #f1f5f9; border-top: 1px solid var(--dw-border); font-size: 13px; font-weight: 600; color: var(--dw-text-mut); }
.dw-dot { margin: 0 10px; opacity: 0.5; }

/* Buttons Grid */
.dw-section-title { font-size: 15px; font-weight: 700; color: var(--dw-text); margin: 0 0 15px 0; text-transform: uppercase; letter-spacing: 0.5px; }
.dw-btn-grid { display: grid; gap: 12px; margin-bottom: 30px; }
.standard-grid { grid-template-columns: repeat(3, 1fr); }
.dev-grid { grid-template-columns: repeat(4, 1fr); }

/* Base Button Styles */
.dw-case-btn { padding: 14px; border-radius: 12px; font-weight: 600; font-size: 15px; cursor: pointer; transition: 0.2s; font-family: var(--dw-font); display: flex; justify-content: center; align-items: center; border: 2px solid var(--dw-border); background: #fff; color: var(--dw-text); }
.dw-case-btn:hover { border-color: var(--dw-primary); color: var(--dw-primary); background: #eff6ff; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(37,99,235,0.1);}

/* Divider */
.dw-divider { border: none; height: 1px; background: var(--dw-border); margin: 30px 0; }

/* Action Bar */
.dw-action-bar { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 15px; }
.dw-main-actions { display: flex; gap: 10px; flex-wrap: wrap; }

.dw-util-btn, .dw-primary-btn, .dw-danger-btn { padding: 14px 20px; border-radius: 12px; font-weight: 700; font-size: 15px; cursor: pointer; transition: 0.2s; font-family: var(--dw-font); border: none; }

/* ========================================== */
/* 🚨 NUCLEAR THEME OVERRIDE FOR BUTTONS      */
/* ========================================== */

/* Developer Mode Buttons */
body .dw-case-wrapper button.dw-dev-btn { background-color: #f1f5f9 !important; border-color: #e2e8f0 !important; font-family: monospace !important; font-size: 14px !important; color: #475569 !important; -webkit-text-fill-color: #475569 !important;}
body .dw-case-wrapper button.dw-dev-btn:hover { background-color: var(--dw-dev) !important; border-color: var(--dw-dev) !important; color: #fff !important; -webkit-text-fill-color: #fff !important; transform: translateY(-2px); box-shadow: 0 8px 15px rgba(15,23,42,0.2);}

/* Utility & Primary Buttons */
body .dw-case-wrapper button.dw-util-btn { background-color: #fff !important; border: 2px solid #e2e8f0 !important; color: #0f172a !important; -webkit-text-fill-color: #0f172a !important; }
body .dw-case-wrapper button.dw-util-btn:hover { background-color: #f8fafc !important; border-color: #cbd5e1 !important; color: #0f172a !important; -webkit-text-fill-color: #0f172a !important; }

body .dw-case-wrapper button.dw-primary-btn { background-color: #2563eb !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; }
body .dw-case-wrapper button.dw-primary-btn:hover { background-color: #1d4ed8 !important; transform: translateY(-2px); box-shadow: 0 8px 15px rgba(37,99,235,0.2); }

body .dw-case-wrapper button.dw-danger-btn { background-color: #fee2e2 !important; color: #dc2626 !important; -webkit-text-fill-color: #dc2626 !important; }
body .dw-case-wrapper button.dw-danger-btn:hover { background-color: #fca5a5 !important; }


/* ========================================== */
/* 📱 BULLETPROOF MEDIA QUERIES               */
/* ========================================== */
@media(max-width: 900px) {
    .standard-grid { grid-template-columns: repeat(2, 1fr); }
    .dev-grid { grid-template-columns: repeat(2, 1fr); }
}

@media(max-width: 600px) {
    .dw-case-wrapper { padding: 30px 10px; }
    .dw-case-card { padding: 25px 20px; }
    .dw-case-header h2 { font-size: 26px; }
    
    .standard-grid, .dev-grid { grid-template-columns: 1fr; gap: 10px; }
    
    .dw-action-bar { flex-direction: column; align-items: stretch; }
    .dw-main-actions { flex-direction: column; }
    .dw-main-actions button, #dw_btn_spaces { width: 100%; }
}