/* dashboard-app.css - Global Settings & Favorites */
.settings-modal-overlay {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0,0,0,0.5); backdrop-filter: blur(4px);
    display: none; align-items: center; justify-content: center; z-index: 1000;
}
.settings-modal {
    background: var(--white); border: 1px solid var(--border);
    border-radius: 12px; padding: 24px; width: 90%; max-width: 400px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.2);
}
.settings-modal h3 { font-size: 1.2rem; color: var(--text-dark); margin-bottom: 16px; font-family: var(--serif, sans-serif); }
.settings-modal p { font-size: 0.85rem; color: var(--text-light); margin-bottom: 16px; }
.settings-modal .field-group { margin-bottom: 12px; }
.settings-modal .field-label { font-size: 0.8rem; font-weight: 600; color: var(--text-dark); margin-bottom: 4px; display: block; }
.settings-modal .modal-actions { display: flex; justify-content: flex-end; gap: 12px; margin-top: 24px; }
.btn-save { background: var(--accent-teal, var(--accent, #1a8a7d)); color: white; padding: 8px 16px; border-radius: 8px; border: none; font-weight: 600; cursor: pointer; }
.btn-cancel { background: var(--cream); color: var(--text-dark); padding: 8px 16px; border-radius: 8px; border: 1px solid var(--border); font-weight: 600; cursor: pointer; }

.fav-item {
    display: flex; justify-content: space-between; align-items: center;
    padding: 8px 12px; background: var(--white); border: 1px solid var(--border);
    border-radius: 8px; font-size: 0.85rem; cursor: pointer; transition: all 0.2s;
}
.fav-item:hover { border-color: var(--accent); background: var(--cream); }
.fav-item-title { font-weight: 600; color: var(--text-dark); }
.fav-item-cat { font-size: 0.75rem; color: var(--text-light); }
#btnStar.active { color: #eab308 !important; fill: #eab308; }

/* Global Mobile Fixes */
html { overflow-x: hidden; }

/* Copy Button Visibility Fixes */
#btnCopy {
    background: var(--cream) !important;
    border: 1px solid var(--border) !important;
    color: var(--text-dark) !important;
}
#btnCopy:hover {
    background: var(--border) !important;
}
#btnCopy.copied {
    background: #059669 !important;
    border-color: #059669 !important;
    color: #fff !important;
}

:root.dark-mode #btnCopy {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #E2E8F0 !important;
}
:root.dark-mode #btnCopy:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}
:root.dark-mode #btnCopy.copied {
    background: #059669 !important;
    border-color: #059669 !important;
    color: #fff !important;
}

/* Mobile Responsiveness Fixes */
@media(max-width:860px) {
    .preview-header { flex-wrap: wrap; gap: 12px; justify-content: flex-start; }
    .preview-header > div:last-child { flex-wrap: wrap; justify-content: flex-start; }
    .settings-modal { padding: 16px; margin: 16px; }
    
    /* Fix Nav Overflow on Mobile */
    .nav-left { gap: 8px !important; }
    .nav-logo { display: none !important; }
    .btn-back { font-size: 0 !important; padding: 8px !important; }
    .niche-badge { font-size: 0.65rem !important; padding: 4px 6px !important; }
}