.dh-importer-app .window-content { background: url("../../../systems/daggerheart/assets/backgrounds/daggerheart_bg_dark.webp"), #1a1a1a; background-size: cover; color: #e0d0b0; padding: 0; display: flex; flex-direction: column; overflow: hidden; /* Prevent window scrolling, force internal scrolling */ } .dh-importer-app form { padding: 5px; /* Reduced padding for wider content */ height: 100%; } .dh-wrapper { display: flex; flex-direction: column; gap: 10px; height: 100%; } .dh-importer-app h2 { border-bottom: 2px solid #cbb484; color: #cbb484; font-family: "Modesto Condensed", serif; font-size: 1.5em; margin-bottom: 5px; /* Reduced space */ text-shadow: 1px 1px 2px #000; } .dh-importer-app .form-group { background: rgba(0, 0, 0, 0.3); padding: 10px; border: 1px solid #4a4a4a; border-radius: 4px; margin: 5px 0; /* Reduced space */ } .dh-importer-app textarea { background: rgba(0, 0, 0, 0.6); border: 1px solid #7a6a4a; color: #fff; padding: 15px; border-radius: 4px; font-family: "Fira Code", monospace; font-size: 14px; width: 100%; height: 100%; /* removed min-height to allow flex shrinking/growing without pushing buttons off */ box-sizing: border-box; resize: none; box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5); display: block; } .dh-importer-app label { font-weight: bold; color: #cbb484; display: block; margin-bottom: 5px; font-family: "Modesto Condensed", serif; font-size: 1.2em; } .dh-importer-app select { background: rgba(0, 0, 0, 0.8); color: #fff; border: 1px solid #7a6a4a; padding: 8px; border-radius: 4px; width: 100%; font-size: 1.1em; } .dh-importer-app button { background: linear-gradient(180deg, #5b1c1c 0%, #3a0e0e 100%); border: 1px solid #7a6a4a; color: #ffd700; padding: 8px 16px; font-family: "Modesto Condensed", serif; font-size: 1.2em; text-transform: uppercase; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); cursor: pointer; transition: all 0.2s; } .dh-importer-app button:hover { background: linear-gradient(180deg, #7a2828 0%, #561414 100%); box-shadow: 0 0 8px #cbb484; text-shadow: 0 0 5px #ffd700; border-color: #ffd700; } .dh-importer-app button i { margin-right: 5px; } /* Preview Styles */ .dh-importer-preview { display: flex; flex-direction: column; height: 100%; overflow: hidden; padding-top: 10px; /* Add space before preview */ } .dh-importer-preview .actor-list { flex: 1; overflow-y: auto; padding-right: 5px; margin-bottom: 10px; } .dh-importer-preview .actor-preview { background: rgba(20, 20, 20, 0.8); border: 1px solid #7a6a4a; padding: 15px; margin-bottom: 15px; border-radius: 8px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); } .dh-importer-preview h3 { display: flex; flex-direction: column; /* Stack Name and Tier */ align-items: flex-start; border-bottom: 1px solid #4a4a4a; padding-bottom: 10px; margin-top: 20px; margin-bottom: 20px; /* Space after name/tier */ } .dh-importer-preview h3 small { font-size: 0.7em; /* Slightly larger */ color: #aaa; margin-left: 0; /* Reset margin since it's stacked */ margin-top: 5px; /* Space between name and tier */ font-family: sans-serif; text-transform: uppercase; letter-spacing: 1px; } .dh-importer-preview .stats { display: flex; gap: 20px; /* Increased spacing */ margin-bottom: 30px; /* More space before features */ flex-wrap: wrap; justify-content: flex-start; } .dh-importer-preview .stats span { background: #2a2a2a; padding: 8px 16px; /* Increased padding */ border-radius: 4px; border: 1px solid #444; color: #ccc; font-size: 1.1em; /* Larger text */ box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.5); display: flex; align-items: center; gap: 5px; } .dh-importer-preview .stats span strong { color: #e0d0b0; /* Gold color for labels */ } .dh-importer-preview .features-list h4 { color: #a0a0a0; font-size: 1em; /* Small header */ text-transform: uppercase; border-bottom: 1px solid #444; padding-bottom: 5px; margin-top: 20px; /* Whitespace before */ margin-bottom: 15px; /* Whitespace after */ } .dh-importer-preview .features-list ul { list-style: none; padding: 0; margin: 0; } .dh-importer-preview .feature-item { background: rgba(255, 255, 255, 0.03); border-left: 3px solid #7a6a4a; padding: 8px; margin-bottom: 8px; border-radius: 0 4px 4px 0; } .dh-importer-preview .feature-item strong { color: #e0d0b0; font-size: 1.1em; } .dh-importer-preview .feature-match { background: rgba(46, 139, 87, 0.2); border: 1px solid rgba(46, 139, 87, 0.4); padding: 5px 8px; border-radius: 4px; margin: 5px 0; font-size: 0.9em; display: flex; align-items: center; } .dh-importer-preview .feature-match input { margin-right: 8px; } .dh-importer-preview .new-tag { background: #b8860b; color: #000; padding: 2px 6px; border-radius: 3px; font-weight: bold; font-size: 0.75em; text-transform: uppercase; display: inline-block; margin-left: 5px; } .dh-importer-preview .desc { color: #aaa; font-size: 0.9em; margin-top: 5px; line-height: 1.4; } .dh-importer-app .action-footer { display: flex; justify-content: flex-end; gap: 10px; padding-top: 10px; border-top: 1px solid #4a4a4a; }