* { -webkit-tap-highlight-color: transparent; }
::selection { background: #1e40af; color: #fff; }
::-moz-selection { background: #1e40af; color: #fff; }

body { max-width: 100%; height: 100% }
.container.outer { display:block; width: 100%; max-width: 800px; margin: 0 auto; padding: 0 15px }
.container.inner { display:block; width: 100%; max-width: 800px; margin: 0 auto 30px; background: #fff; border-radius: 5px; height: auto; min-height: 700px; padding: 20px }
.htu { background: #fff3cd; color: #333; padding: 15px; border-radius: 5px; margin-top: 30px; margin-bottom: 30px; line-height: 150% }

.rb-section { border-bottom: 1px solid #e5e5e5; padding-bottom: 20px; margin-bottom: 20px; }
.rb-section:last-of-type { border-bottom: none; }
.rb-section h3 { margin: 0 0 12px; font-size: 16px; color: #1e40af; }
.rb-section .hint { margin: -6px 0 8px; font-size: 12px; color: #777; }
.rb-section .optional { font-weight: 400; font-size: 12px; color: #888; }

.field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; }
.field-grid label { display: flex; flex-direction: column; font-size: 13px; color: #333; gap: 4px; }
.field-grid input, textarea { border: 1px solid #ccc; border-radius: 4px; padding: 8px 10px; font-size: 14px; font-family: inherit; width: 100%; box-sizing: border-box; }
textarea { display:block; margin-top: 4px; }
.rb-section > textarea { width: 100%; }

.block { border: 1px solid #ccc; padding: 12px; margin-bottom: 12px; border-radius: 6px; background:#fafafa; }
.block-controls { text-align:right; margin-bottom:10px; }
.btn-small { padding: 2px 6px; margin: 5px 2px; }
.btn-small:hover { padding: 2px 6px; margin: 5px 2px; background: #4caf50}

button { margin: 5px; padding: 10px 10px; }
#addExperience, #addEducation { background: #1e40af; color: #fff; border: none; border-radius: 4px; cursor: pointer; }
#addExperience:hover, #addEducation:hover { background: #4caf50; }

.center {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    gap: 10px;
}
.center br { display: none; }
.center button { width: 190px; margin: 0; }
.center button.btn-wide { width: 240px; white-space: nowrap; }

@media (max-width: 600px) {
    .field-grid { grid-template-columns: 1fr; }
    .center { flex-direction: column; align-items: center; }
    .center button { width: 100%; max-width: 320px; }
    .center button.btn-wide { width: 100%; max-width: 320px; white-space: normal; }
}

button#rbPreview:hover, button#rbGenerate:hover, button#rbSaveConfig:hover, button#rbLoadConfig:hover { background: #4caf50 }
button.delete{ background:#fe1818 }

body.scroll-locked { overflow: hidden; }

.pdf-preview-overlay {
    position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 9999;
    display: flex; align-items: center; justify-content: center;
    background-color: rgba(0, 0, 0, 0.75);
}
.pdf-preview-modal {
    position: relative; width: 92vw; height: 92vh; max-width: 900px;
    background-color: #fff; display: flex; flex-direction: column;
    border-radius: 6px; overflow: hidden;
}
.pdf-preview-toolbar { display: flex; justify-content: flex-end; gap: 8px; padding: 8px; background-color: #222; }
.pdf-preview-toolbar button { background: none; border: none; color: #fff; font-size: 20px; line-height: 1; cursor: pointer; padding: 4px 10px; width: auto; margin: 0; }
.pdf-preview-toolbar button:hover, .pdf-preview-toolbar button:focus-visible { background: none; color: #ccc; }
.pdf-preview-iframe { flex: 1; width: 100%; border: none; }

#rbFilename { background: #1e40af; color: #fff; border: none; }
#rbFilename::placeholder { color: #fff; opacity: 1; }
#rbFilename::-moz-placeholder { color: #fff; opacity: 1; }

.btn-danger { background: #c0392b; }
.btn-danger:hover { background: #922b21; }