/* Bootstrap 5.3と既存の画像・色選択部を併用するための、名刺版だけの調整。 */
.sscards-editor, .sscards-result { margin: 0; background: #e2e8f0; color: var(--bs-body-color); font: 1rem/1.6 var(--bs-body-font-family); }
.sscards-editor > :not(.sscards-workspace):not(script):not(.modal-content):not(.modal-overlay) { display: none; }
.sscards-workspace { display: grid; grid-template-columns: minmax(420px, 7fr) minmax(340px, 5fr); height: 100dvh; }
.sscards-settings { overflow: auto; padding: 1.5rem; background: var(--bs-tertiary-bg); }
.sscards-settings .fm { width: auto; max-width: none; margin: 0; padding: 0; }
.sscards-settings header h1 { margin: 0; padding: 0; background: none; color: inherit; text-shadow: none; border: 0; }
.sscards-settings header h1::before { content: none; }
.sscards-settings header p { font-size: .875rem; margin: .5rem 0 1rem; }
.sscards-settings fieldset.card, .sscards-output fieldset.card { display: block; min-width: 0; padding: 0; border: 1px solid var(--bs-border-color); border-radius: var(--bs-border-radius); background: var(--bs-body-bg); }
.sscards-settings legend.card-header, .sscards-output legend.card-header { float: none; width: 100%; margin: 0; padding: .75rem 1rem; color: var(--bs-body-color); background: var(--bs-tertiary-bg); border-bottom: 1px solid var(--bs-border-color); }
.sscards-settings .sscards-text-card { border-color: #93c5fd !important; }
.sscards-settings .sscards-text-card > .card-header { background: #eff6ff; }
.sscards-settings .card-body, .sscards-output .card-body { padding: 1rem; display: flow-root; }
.sscards-settings h2 { padding: 0; color: var(--bs-body-color); background: none; border: 0; }
.sscards-settings .form-control, .sscards-output .form-control { width: 100%; max-width: 100%; margin: .25rem 0; padding: .375rem .75rem; border: 1px solid var(--bs-border-color); border-radius: var(--bs-border-radius); line-height: 1.5; font-size: 1rem; }
.sscards-settings textarea#docs { min-height: 12rem; height: auto; resize: vertical; }
.sscards-settings input[type="number"].form-control { display: inline-block; width: 6rem; }
.sscards-settings .form-select { display: inline-block; width: auto; max-width: 100%; margin: .25rem 0; }
.sscards-settings .form-check-input, .sscards-output .form-check-input { float: none; margin: .3em .3em 0 0; vertical-align: top; }
.sscards-settings .form-check-label, .sscards-output .form-check-label { font-size: .9375rem; white-space: normal; }
.sscards-settings .form-range { max-width: 100% !important; vertical-align: middle; }
.sscards-editor .btn, .sscards-result .btn, .sscards-editor #random.btn {
 padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x); border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);
 border-radius: var(--bs-btn-border-radius); background: var(--bs-btn-bg); color: var(--bs-btn-color);
 font-size: var(--bs-btn-font-size); font-family: var(--bs-body-font-family); line-height: var(--bs-btn-line-height);
 letter-spacing: normal; text-shadow: none; box-shadow: none; filter: none; margin: .25rem .25rem .25rem 0;
}
.sscards-editor .btn:hover, .sscards-result .btn:hover, .sscards-editor #random.btn:hover { background: var(--bs-btn-hover-bg); color: var(--bs-btn-hover-color); border-color: var(--bs-btn-hover-border-color); }
.sscards-editor .btn:focus-visible, .sscards-result .btn:focus-visible { box-shadow: var(--bs-btn-focus-box-shadow); }
.sscards-settings section.img_select { border-radius: .5rem; margin: .25rem; padding: .5rem; height: auto !important; min-height: 8rem; text-align: center; }
.sscards-settings section.img_select:has(input[name="d"]:checked) { background: var(--bs-primary-bg-subtle); outline: 2px solid var(--bs-primary); }
.sscards-settings section.img_select img { max-width: 100%; object-fit: contain; }
.sscards-settings section.img_select:has(input[name="d"]) img { border: 0 !important; }
.sscards-layout-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; clear: both; margin: 1rem 0; }
.sscards-layout-card { position: relative; min-width: 0; border: 2px solid transparent; border-radius: .65rem; background: var(--bs-body-bg); }
.sscards-layout-card:hover { background: var(--bs-tertiary-bg); }
.sscards-layout-card:has(input:checked) { border-color: var(--bs-primary); background: var(--bs-primary-bg-subtle); }
.sscards-layout-card:has(input:focus-visible) { outline: 3px solid var(--bs-primary); outline-offset: 3px; }
.sscards-layout-card:has(input:checked)::after { content: '✓'; position: absolute; top: 4px; right: 7px; color: var(--bs-primary); font-weight: bold; pointer-events: none; }
.sscards-layout-card > label { display: flex; flex-direction: column; align-items: center; gap: .45rem; width: 100%; height: 100%; padding: 16px 8px 12px; margin: 0 !important; cursor: pointer; }
.sscards-layout-image { display: flex; align-items: center; justify-content: center; width: 100%; height: 140px; }
.sscards-layout-image img { display: block; width: auto; height: auto; max-width: 100%; max-height: 100%; border: 0 !important; object-fit: contain; }
.sscards-layout-image canvas { display: block; width: auto !important; height: auto !important; max-width: 100% !important; max-height: 100% !important; border: 0 !important; }
.sscards-layout-image img, .sscards-layout-image canvas { outline: 1px solid #adb5bd; outline-offset: 0; }
.sscards-settings #SimOpen[hidden], .sscards-settings #SimOption[hidden] { display: none !important; }
.sscards-layout-name { font-size: .9375rem; font-weight: 600; }
.sscards-layout-count { color: var(--bs-secondary-color); font-size: .75rem; }
.sscards-layout-card[hidden] { display: none; }
.sscards-orientation .btn.active { background: var(--bs-btn-active-bg); color: var(--bs-btn-active-color); border-color: var(--bs-btn-active-border-color); }
.sscards-settings #bg { position: relative; padding: 0 1.5rem; }
.sscards-settings #bg_list { position: relative; display: flex; flex-direction: column; flex-wrap: wrap; align-content: flex-start; height: 320px; overflow-x: auto; }
.sscards-settings #bg_list section { flex: 0 0 100px; height: 100px !important; min-height: 0; width: 90px; margin: 0; padding: 0 10px 0 0; font-size: 12px; text-align: center; }
.sscards-settings #bg_list .bgselect { position: absolute; opacity: 0; width: 1px; height: 1px; }
.sscards-settings #bg_list img { width: 75px; height: 75px; border: 1px solid #999; }
.sscards-settings #bg_list .bgselect:checked + label img { border: 3px solid #0d6efd; }
.sscards-settings #bg_list .bgselect:focus-visible + label img { outline: 2px solid #0d6efd; outline-offset: 2px; }
.sscards-settings #bg .leftbutton, .sscards-settings #bg .rightbutton { position: absolute; top: 100px; z-index: 1; padding: .5rem .25rem; margin: 0; }
.sscards-settings #bg .leftbutton { left: 0; }
.sscards-settings #bg .rightbutton { right: 0; }
.sscards-settings #backgroundFilters .btn { margin: .15rem; }
.sscards-settings #backgroundSets .btn.active { background: var(--bs-btn-active-bg); color: var(--bs-btn-active-color); border-color: var(--bs-btn-active-border-color); }
.sscards-settings .color label { border-radius: .25rem; font-size: .875rem; height: auto; min-height: 2rem; }
.sscards-settings .color label:has(input[type="checkbox"]) { display: block; float: none; clear: both; width: auto; max-width: 100%; }
.sscards-settings .color label[style*="background-color"] { border: 1px solid #adb5bd; }
.sscards-settings .color input[type="radio"]:checked + label { outline: 2px solid var(--bs-primary); outline-offset: 1px; border-bottom: 0; }
.sscards-settings #TR { display: none; }
.sscards-preview { display: flex; flex-direction: column; min-width: 0; padding: 1.25rem; overflow: hidden; }
.sscards-toolbar { display: flex; justify-content: space-between; align-items: center; gap: .75rem; }
.sscards-preview iframe { border: 0; width: 100%; flex: 1; min-height: 0; background: #e2e8f0; }
.sscards-preview iframe[hidden] { display: none; }
#sscards-status, .sscards-notice { font-size: .875rem; margin: .5rem 0; color: var(--bs-secondary-color); }
.sscards-handle { display: none; }
.sscards-editor #menu-icon, .sscards-result #menu-icon { display: none !important; }
.sscards-editor > .modal-content { display: none; position: fixed; z-index: 200; max-width: 90vw; max-height: 85dvh; overflow: auto; }
.sscards-editor > .modal-overlay { z-index: 190; }
.sscards-result > :not(.sscards-output):not(script):not(#fontload) { display: none; }
.sscards-output { padding: .75rem; overflow-wrap: anywhere; }
.sscards-output .cvs { width: auto; margin: 0; }
.sscards-output [style="margin: 50px 0;"] { display: none; }
.sscards-output img.meishi, .sscards-result #display { width: auto; height: auto; max-width: 100%; max-height: 65vh; }
.sscards-result .saveform { overflow-wrap: anywhere; }
@media (max-width: 767px) {
 .sscards-workspace { display: block; }
 .sscards-preview { box-sizing: border-box; height: 100dvh; padding: .75rem .75rem 76px; }
 .sscards-settings { position: fixed; bottom: 0; left: 0; right: 0; z-index: 100; height: 60px; box-sizing: border-box; padding: 0 .75rem; overflow: hidden; border: 1px solid var(--bs-border-color); border-radius: 1rem 1rem 0 0; box-shadow: 0 -.6rem 1.5rem #0f172a33; }
 .sscards-settings.is-open { height: 80dvh; overflow: auto; }
 .sscards-handle { display: block; position: sticky; top: 0; z-index: 2; width: 100%; min-height: 60px; border: 0; background: var(--bs-tertiary-bg); color: var(--bs-body-color); font: bold 1rem var(--bs-body-font-family); cursor: pointer; }
}