:root {
    --bg-color: #e5e5ea;
    --bg-gradient: radial-gradient(at 0% 0%, #ffffff 0px, transparent 50%), radial-gradient(at 100% 0%, #e5eedf 0px, transparent 50%), radial-gradient(at 100% 100%, #d5e1f0 0px, transparent 50%), radial-gradient(at 0% 100%, #f4e8e8 0px, transparent 50%);
    --card-bg: rgba(255, 255, 255, 0.45);
    --card-blur: blur(40px);
    --text-main: #1d1d1f;
    --text-light: #86868b;
    --accent: #0071e3;
    --accent-hover: #0077ED;
    --danger: #ff3b30;
    --border: rgba(255, 255, 255, 0.6);
    --radius: 28px;
}

#burns-dashboard-wrapper,
#burns-dashboard-wrapper * {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important;
    box-sizing: border-box !important;
}

#burns-dashboard-wrapper {
    position: fixed !important; top: 0 !important; left: 0 !important;
    width: 100vw !important; height: 100vh !important;
    z-index: 2147483647 !important; background-color: var(--bg-color) !important;
    background-image: var(--bg-gradient) !important; overflow: hidden !important;
    margin: 0 !important; padding: 0 !important;
    color: var(--text-main) !important; display: flex; flex-direction: column;
    -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}

#burns-dashboard-wrapper ::-webkit-scrollbar { width: 8px; }
#burns-dashboard-wrapper ::-webkit-scrollbar-track { background: transparent; }
#burns-dashboard-wrapper ::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.15); border-radius: 10px; }

.burns-header { padding: 24px 32px 16px 32px; text-align: center; flex-shrink: 0; }
.burns-header h1 { margin: 0; font-size: 36px; font-weight: 800; letter-spacing: -1px;}

.burns-grid {
    display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 32px;
    padding: 10px 32px 32px 32px; flex-grow: 1; min-height: 0; max-width: 1800px; margin: 0 auto; width: 100%;
}

.burns-main-column { display: flex; flex-direction: column; gap: 24px; min-height: 0; }
.burns-side-column { display: flex; flex-direction: column; min-height: 0; }

.burns-card {
    background: var(--card-bg); backdrop-filter: var(--card-blur); -webkit-backdrop-filter: var(--card-blur);
    border: 1px solid var(--border); border-radius: var(--radius); padding: 24px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.03), inset 0 1px 0 rgba(255,255,255,0.8);
    display: flex; flex-direction: column; flex-grow: 1; min-height: 0;
}
.burns-card h2 { margin-top: 0; font-size: 24px; font-weight: 700; border-bottom: 1px solid rgba(0,0,0,0.06); padding-bottom: 16px; margin-bottom: 20px; flex-shrink: 0; letter-spacing: -0.5px;}

/* Inputs */
.burns-input-row { display: flex; gap: 12px; margin-bottom: 20px; flex-shrink: 0; }

.burns-input-row input,
.burns-input-row select,
.burns-full-input {
    flex-grow: 1;
    height: 50px !important;
    padding: 0 16px !important;
    border: 1px solid rgba(0,0,0,0.08) !important;
    border-radius: 12px !important;
    font-size: 15px !important;
    background: rgba(255,255,255,0.7) !important;
    font-family: inherit !important;
    min-width: 0;
    box-sizing: border-box !important;
    color: var(--text-main);
}

.burns-input-row input:focus,
.burns-input-row select:focus,
.burns-full-input:focus {
    outline: none !important; border-color: var(--accent) !important; background: #ffffff !important; box-shadow: 0 0 0 4px rgba(0, 113, 227, 0.15) !important;
}

.burns-btn {
    background: var(--accent); color: white; border: none; padding: 0 24px;
    height: 50px; border-radius: 12px; cursor: pointer; font-weight: 600; font-size: 15px; white-space: nowrap;
}
.burns-btn:hover { background: var(--accent-hover); transform: scale(0.98); }

/* SVG-Centered FAB */
.burns-fab {
    position: absolute; bottom: 24px; right: 24px; width: 44px; height: 44px;
    border-radius: 50%; background: var(--accent); color: white;
    border: none; cursor: pointer; box-shadow: 0 8px 20px rgba(0, 113, 227, 0.4);
    display: flex; align-items: center; justify-content: center;
    transition: all 0.2s ease; z-index: 10; padding: 0; margin: 0;
}
.burns-fab svg { display: block; margin: auto; }
.burns-fab:hover { transform: scale(1.05); background: var(--accent-hover); box-shadow: 0 10px 24px rgba(0, 113, 227, 0.5); }

/* Lists and Scrolling */
.burns-scroll-area { flex-grow: 1; overflow-y: auto; padding-right: 8px; }

.burns-list { list-style: none; padding: 0; margin: 0; }
.burns-list li {
    display: flex; justify-content: space-between; align-items: center; padding: 12px 0;
    border-bottom: 1px solid rgba(0,0,0,0.04); font-size: 16px; font-weight: 500;
}
.burns-list li:last-child { border-bottom: none; }
.burns-delete { background: none; color: var(--danger); border: none; font-size: 24px; cursor: pointer; opacity: 0.4; padding: 0 5px; margin-left: 12px; transition: opacity 0.2s ease;}
.burns-delete:hover { opacity: 1; }
.burns-item-date { display: block; font-size: 12px; color: var(--text-light); font-weight: 600; margin-top: 4px; }

/* Calendar Icons & Event Pill */
.burns-cal-list li {
    background: rgba(255,255,255,0.6); border-radius: 16px; padding: 16px 20px;
    margin-bottom: 12px; border: 1px solid var(--border);
    display: flex; justify-content: space-between; align-items: center;
}
.burns-event-layout { display: flex; align-items: center; gap: 16px; }

.burns-cal-icon {
    background: #ffffff; border-radius: 8px; border: 1px solid rgba(0,0,0,0.08);
    overflow: hidden; width: 54px; text-align: center; box-shadow: 0 3px 8px rgba(0,0,0,0.04);
    flex-shrink: 0; display: flex; flex-direction: column;
}
.b-month { background: var(--danger); color: white; font-size: 11px; font-weight: 800; padding: 3px 0; letter-spacing: 1px; }
.b-day { font-size: 20px; font-weight: 800; color: #1d1d1f; padding: 2px 0; line-height: 1; }
.b-dow { font-size: 10px; font-weight: 700; color: var(--text-light); padding-bottom: 4px; letter-spacing: 0.5px; }

.burns-event-details { display: flex; flex-direction: column; gap: 4px; }
.burns-cal-desc { font-size: 17px; font-weight: 600; }
.burns-event-time { font-size: 13px; color: var(--text-light); font-weight: 700; }

.burns-event-pill {
    background: rgba(0, 113, 227, 0.1); color: var(--accent);
    font-size: 11px; font-weight: 800; padding: 4px 10px; border-radius: 12px;
    text-transform: uppercase; letter-spacing: 0.5px; white-space: nowrap;
}

/* Meal Plan */
.burns-meal-day-title { font-weight: 700; font-size: 18px; margin-bottom: 12px; letter-spacing: -0.5px;}
.burns-meal-item {
    display: flex; justify-content: space-between; align-items: center; background: rgba(255,255,255,0.6);
    padding: 14px 18px; border-radius: 16px; margin-bottom: 10px; border: 1px solid rgba(255,255,255,0.8);
}
.burns-meal-type { font-weight: 700; width: 110px; color: var(--text-light); font-size: 13px; text-transform: uppercase; letter-spacing: 0.5px;}
.burns-meal-desc-text { font-size: 15px; font-weight: 500; }

/* Appliances */
.burns-stacked-appliances {
    display: flex; flex-direction: column; gap: 24px; height: 100%; justify-content: space-between;
}
.burns-appliance {
    background: linear-gradient(135deg, #ffffff 0%, #f0f0f5 100%); border: 1px solid rgba(0,0,0,0.05);
    border-radius: 20px; cursor: pointer; position: relative; box-shadow: -10px 15px 30px rgba(0,0,0,0.05), inset 2px 2px 10px white;
    transition: transform 0.2s; display: flex; align-items: center; justify-content: center; width: 100%; flex-grow: 1; min-height: 250px;
}
.burns-appliance:hover { transform: translateY(-4px); }
.burns-handle {
    background: linear-gradient(to right, #d1d1d6, #f2f2f7, #d1d1d6); position: absolute; border-radius: 6px;
    box-shadow: 2px 4px 8px rgba(0,0,0,0.1); height: 120px; width: 12px; top: 50%; transform: translateY(-50%);
}
.burns-fridge .burns-handle { right: 24px; }
.burns-freezer .burns-handle { left: 24px; }
.burns-app-label { font-weight: 800; color: #a1a1a6; letter-spacing: 6px; font-size: 20px; opacity: 0.4; }

/* Modals & Close Button */
.burns-modal {
    position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
    background: rgba(0,0,0,0.4); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
    display: none; justify-content: center; align-items: center; z-index: 1000;
}
.burns-modal.active { display: flex; }
.burns-modal-content {
    background: rgba(245, 245, 247, 0.95); padding: 40px; border-radius: 32px; width: 90%; max-width: 600px;
    position: relative; max-height: 85vh; display: flex; flex-direction: column;
    box-shadow: 0 40px 80px rgba(0,0,0,0.2); border: 1px solid rgba(255,255,255,0.5);
}
.burns-modal h2 { font-size: 28px; margin-top: 0; margin-bottom: 24px; letter-spacing: -1px; font-weight: 700; }

.burns-close {
    position: absolute; top: 20px; right: 20px; width: 36px; height: 36px; border-radius: 50%;
    border: none; cursor: pointer; background: rgba(0,0,0,0.05); color: var(--text-main);
    display: flex; align-items: center; justify-content: center; transition: all 0.2s ease; padding: 0; margin: 0;
}
.burns-close svg { display: block; margin: auto; }
.burns-close:hover { background: var(--accent); color: white; }

@media (max-width: 1024px) {
    #burns-dashboard-wrapper { height: auto !important; overflow-y: auto !important; display: block; }
    .burns-grid { grid-template-columns: 1fr; grid-template-rows: auto; height: auto; }
}
