﻿.ja-allergen-section,.ja-allergen-editor{margin:10px 0;padding:10px;border:1px solid #d7dfda;border-radius:6px;background:#fff;color:#263b30;font-size:13px;line-height:1.4}
.ja-allergen-section h4{font-size:15px;margin:0 0 8px}.ja-allergen-editor p{font-size:12px;margin:8px 0}.ja-allergen-editor button{font-size:12px;padding:4px 8px;white-space:normal}.ja-allergen-editor label{font-size:13px!important;float:none!important}.ja-allergen-editor select{width:100%;font-size:13px}
.ja-allergen-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;border-bottom:1px solid #e3e6e4;padding:8px 0}.ja-allergen-row>div:first-child{min-width:95px;flex:1}.ja-allergen-row strong{font-size:13px}.ja-allergen-row small{display:block;font-size:11px;color:#52655b}.ja-allergen-swatches{display:flex;gap:3px}.ja-light,.ja-dark{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid #bbb;vertical-align:middle}.ja-light{background:#fff}.ja-dark{background:#222}.ja-allergen-swatches img{max-width:30px;max-height:30px;object-fit:contain}.ja-allergen-actions{display:flex;flex-wrap:wrap;gap:3px}.ja-allergen-status{font-size:12px;min-height:18px;margin:6px 0}.ja-error{color:#a51d22}.ja-allergen-gallery{padding:8px;background:#f2f5f3;border:1px solid #bac7bf}.ja-allergen-gallery-grid{display:flex;flex-wrap:wrap;gap:6px;max-height:310px;overflow:auto;margin:8px 0}.ja-allergen-pick{background:transparent;padding:3px;border:1px solid #94a399;border-radius:4px}.ja-allergen-pick img{max-width:34px;max-height:34px;object-fit:contain}.ja-allergen-editor [hidden]{display:none!important}.ja-allergen-save,.ja-allergen-reset-all{margin:8px 6px 0 0}

/* Settings use the surrounding horizontal form, type scale and buttons.
   Canvas keeps its compact inspector sizing. */
.ja-allergen-settings-row { clear:both; }
.ja-allergen-editor.ja-allergen-settings { margin:0; padding:0; border:0; border-radius:0; background:transparent; color:inherit; font-size:inherit; }
.ja-allergen-settings .ja-allergen-body { margin-top:8px; }
.ja-allergen-settings .help-block,.ja-allergen-settings p,.ja-allergen-settings .ja-allergen-status { font-size:inherit; line-height:1.5; }
.ja-allergen-settings button { font-size:inherit; padding:5px 10px; }
.ja-allergen-settings .ja-allergen-open,.ja-allergen-settings .ja-allergen-save { padding:6px 14px; }
.ja-allergen-settings .ja-allergen-row { gap:12px; padding:10px 0; }
.ja-allergen-settings .ja-allergen-row strong { font-size:inherit; }
.ja-allergen-settings .ja-allergen-row small { font-size:0.9em; }
.ja-allergen-settings .ja-allergen-row>div:first-child { min-width:130px; }
.ja-allergen-settings .ja-allergen-actions { gap:6px; }
.ja-allergen-status:empty { display:none; }
.ja-allergen-editor .ja-allergen-empty { color:inherit; }
.ja-allergen-editor .ja-error { color:#a51d22; }
@media(max-width:600px) {
    .ja-allergen-settings-row .controls { margin-left:0; }
    .ja-allergen-settings-row>.control-label { float:none; width:auto; text-align:left; }
    .ja-allergen-settings .ja-allergen-actions { flex-basis:100%; }
}

/* Match Settings save buttons without their menu-submit event class. */
.ja-allergen-settings .ja-allergen-save { background:green; color:#fff; }

/* One icon per style; contrast is a preview setting, not a second asset. */
.ja-allergen-gallery .ja-allergen-pick{display:flex;flex-direction:column;align-items:center;width:116px;gap:6px;padding:8px;background:#fff;color:#263b30}
.ja-allergen-choice-preview{display:flex;align-items:center;justify-content:center;width:64px;height:64px;background:#fff;border:1px solid #bbb;border-radius:4px}
.ja-allergen-gallery[data-preview-background="dark"] .ja-allergen-choice-preview{background:#222}
.ja-allergen-gallery .ja-allergen-pick img{width:54px;height:54px;max-width:54px;max-height:54px;object-fit:contain}
.ja-allergen-choice-label{font-size:12px;line-height:1.3;text-align:center;overflow-wrap:anywhere}
.ja-allergen-choice-label small{display:block;color:#52655b}
.ja-allergen-backgrounds{display:flex;flex-wrap:wrap;gap:6px}
.ja-allergen-background[aria-pressed="true"]{outline:2px solid #007b97;outline-offset:1px}
.ja-allergen-footer{display:flex;flex-wrap:wrap;gap:12px}
.ja-allergen-footer>div{flex:1 1 210px}
.ja-allergen-editor p.ja-allergen-action-help{margin:4px 0;font-size:12px;color:#52655b;max-width:45em}

/* Canvas uses the inspector's compact type scale, rather than Settings form sizing. */
.ja-allergen-section.ja-allergen-canvas-section,
.ja-allergen-editor.ja-allergen-canvas {
    min-width:0; max-width:100%; margin:6px 0; padding:0;
    border:0; border-radius:0; background:transparent; font-size:11px; line-height:15px;
}
.ja-allergen-canvas-section p,
.ja-allergen-editor.ja-allergen-canvas p,
.ja-allergen-canvas .ja-allergen-status {
    margin:5px 0; font-size:10px; line-height:14px; overflow-wrap:anywhere;
}
.ja-allergen-canvas label { font-size:10px!important; line-height:14px; margin:0 0 5px; }
.ja-allergen-canvas select {
    width:100%; min-width:0; max-width:100%; height:28px; margin:3px 0 5px;
    padding:3px 5px; font-size:10px; box-sizing:border-box;
}
.ja-allergen-canvas .btn,
.ja-allergen-canvas .ja-allergen-pick {
    min-width:0; max-width:100%; min-height:26px; margin:0; padding:3px 6px;
    font-size:10px; line-height:14px; font-weight:400; white-space:normal;
    overflow-wrap:anywhere; box-sizing:border-box; border-radius:4px;
}
.ja-allergen-canvas .ja-allergen-row {
    display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center;
    gap:6px; padding:8px 0; min-width:0;
}
.ja-allergen-canvas .ja-allergen-row>.ja-allergen-label { min-width:0; }
.ja-allergen-canvas .ja-allergen-row strong { font-size:11px; line-height:15px; overflow-wrap:anywhere; }
.ja-allergen-canvas .ja-allergen-row small { font-size:10px; line-height:14px; }
.ja-allergen-canvas .ja-light,.ja-allergen-canvas .ja-dark { width:26px; height:26px; box-sizing:border-box; }
.ja-allergen-canvas .ja-allergen-swatches img { width:22px; height:22px; max-width:22px; max-height:22px; }
.ja-allergen-canvas .ja-allergen-actions {
    grid-column:1 / -1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; min-width:0;
}
.ja-allergen-canvas .ja-allergen-footer { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; margin-top:10px; }
.ja-allergen-canvas .ja-allergen-footer>div { min-width:0; }
.ja-allergen-canvas .ja-allergen-save { font-weight:600; }
.ja-allergen-canvas .ja-allergen-gallery { min-width:0; padding:6px; margin:4px 0 8px; }
.ja-allergen-canvas .ja-allergen-gallery>strong { font-size:11px; line-height:15px; }
.ja-allergen-canvas .ja-allergen-gallery-grid { gap:5px; max-height:210px; }
.ja-allergen-canvas .ja-allergen-pick { width:calc(50% - 3px); gap:4px; padding:5px; }
.ja-allergen-canvas .ja-allergen-choice-preview { width:44px; height:44px; }
.ja-allergen-canvas .ja-allergen-pick img { width:36px; height:36px; max-width:36px; max-height:36px; }
.ja-allergen-canvas .ja-allergen-choice-label { font-size:10px; line-height:14px; }
.ja-allergen-canvas button:focus-visible { outline:2px solid #007b97!important; outline-offset:1px; }
