/*
ICEN 2027 — EventsAIR Modern form stylesheet
Version 1.2 | 21 October 2026

Built against the rendered Modern-theme sponsorship form:
https://onsite.eventsair.com/cena/sponex-booking-form/Site/Register

INSTALL
Upload this plain CSS file through Brand Setup > Customize Style >
Custom Bootstrap CSS > Add, then save the brand and preview the Modern form.
The upload control was identified in the supplied EventsAIR screenshot;
stylesheet loading in the live form still requires verification.

SCOPE
All rules are scoped to EventsAIR's #theme-modern root. Legacy EA themes and
other portal layouts require a separate check. The existing .icen-form-header
keeps its inline typography and layout, with a white lower panel, fine border
and soft shadow added by this stylesheet. Original ICEN 2027 cube artwork is
embedded as a low-opacity background in the outer page margins; no separate
image upload is required. Fonts must be loaded in the EventsAIR brand settings;
this file does not download fonts.

This stylesheet changes presentation only. It does not add scripts, submit
anything, reveal hidden fields, replace native controls or change form data.
It does not merge/reorder questions, rewrite labels, replace links, expose
tooltip descriptions, change checkbox/radio behaviour or rewrite consent.

MANUAL EDITOR CHANGES STILL REQUIRED
- Group/reorder questions and move website/logo fields beside organisation copy.
- Shorten repeated instructions and move essential tooltip help into visible copy.
- Change "Submit" to "Submit application" if the approval workflow is retained.
- Change "Add Photo" to "Upload organisation logo" where EA permits.
- Correct "Principle", "150words" and "Work" labels as appropriate.
- Set single/multiple-choice behaviour according to the actual booking rules.
- Supply approved prospectus, terms and privacy links/text before launch.
- Replace the 1000 x 125 banner with a sharper approved asset if possible;
  CSS can prevent cropping but cannot restore missing image detail.

VERIFICATION
Selectors and CSS variables were checked against the live public form.
Preview the installed stylesheet on desktop and mobile, including a dropdown,
selection, upload and validation error, before reusing it on another form.
*/

/* 1. Shared CENA colours and the Modern theme's existing design settings. */
html#theme-modern {
  --icen-blue: #4DBBC6;
  --icen-green: #9AC427;
  --icen-navy: #004F7E;
  --icen-ink: #05171D;
  --icen-pale: #EDF6F7;
  --icen-soft: #DBF1F4;
  --icen-muted: #4E6269;
  --icen-line: #D7E3E7;
  --icen-field-border: #6F8994;
  --icen-heading: "Montserrat", Arial, Helvetica, sans-serif;
  --icen-body: "Source Sans Pro", Arial, Helvetica, sans-serif;

  --primary-color: var(--icen-blue);
  --primary-label-color: var(--icen-ink);
  --page-background-color: var(--icen-pale);
  --page-title-text-color: var(--icen-navy);
  --font-family-base: var(--icen-body);
  --font-family-h1: var(--icen-heading);
  --font-family-h2: var(--icen-heading);
  --font-family-h3: var(--icen-heading);
  --font-family-h4: var(--icen-heading);
  --font-family-h5: var(--icen-heading);
  --font-family-h6: var(--icen-heading);
  --font-color-h1: var(--icen-navy);
  --font-color-h2: var(--icen-navy);
  --font-color-h3: var(--icen-navy);
  --font-color-h4: var(--icen-navy);
  --font-color-h5: var(--icen-navy);
  --font-color-h6: var(--icen-navy);
  --font-size-h1: 26px;
  --font-size-h2: 20px;
  --font-size-h3: 18px;
  --font-size-h4: 18px;
  --font-size-h5: 17px;
  --font-size-h6: 16px;

  --Font-size-text-xs: 14px;
  --Font-size-text-sm: 16px;
  --Font-size-text-md: 17px;
  --Line-height-text-xs: 20px;
  --Line-height-text-sm: 24px;
  --Line-height-text-md: 26px;
  --Module-background: #FFFFFF;
  --CardStroke: var(--icen-line);
  --Panel-Radius: 24px;
  --Panel-Padding: 32px;
  --Mob-CardRadius: 20px;
  --Mob-CardGap: 20px;
  --section-spacing: 24px;
  --form-max-width: 800px;
  --panel-max-width: min(800px, 100%);

  /* Neutral field borders and focus; EA error/success variables stay intact. */
  --Colors-Border-border-primary: var(--icen-field-border);
  --focus-visible-box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 5px #004F7E;
  --ss-main-height: 50px;
  --ss-border-radius: 10px;
  --ss-border-color: var(--icen-field-border);
  --ss-font-color: var(--icen-ink);
  --ss-placeholder-color: var(--icen-muted);
  --ss-focus-color: var(--icen-navy);
  --ss-primary-color: var(--icen-navy);
}

#theme-modern body {
  background-color: var(--icen-pale);
  font-family: var(--icen-body);
  color: var(--icen-ink);
}

/* 1a. Quiet ICEN artwork in the pale blue page margins.
   Uses the original approved SVG paths and colours at 12% opacity.
   A pale central band keeps decorative artwork out of the 800px form column.
   The long transparent SVG tile spaces the accents down the page.
   Background images cannot intercept clicks or alter the form layout. */
html#theme-modern {
  --icen-motif-width: clamp(220px, 23vw, 360px);
  --icen-motif-artwork: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22587%22%20height%3D%222200%22%20viewBox%3D%220%200%20587%202200%22%3E%3Cg%20opacity%3D%220.12%22%3E%3Csvg%20x%3D%220%22%20y%3D%22120%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22587%22%20height%3D%22300%22%20viewBox%3D%22443%200%20587%20300%22%3E%3Ctitle%3EOriginal%20ICEN%202027%20interlocking%20geometric%20artwork%3C%2Ftitle%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter-remove-color%22%20x%3D%220%25%22%20y%3D%220%25%22%20width%3D%22100%25%22%20height%3D%22100%25%22%3E%0A%3CfeColorMatrix%20color-interpolation-filters%3D%22sRGB%22%20values%3D%220%200%200%200%201%200%200%200%200%201%200%200%200%200%201%200%200%200%201%200%22%20%2F%3E%0A%3C%2Ffilter%3E%0A%3Cmask%20id%3D%22mask-1%22%3E%0A%3Cg%20filter%3D%22url%28%23filter-remove-color%29%22%3E%0A%3Crect%20x%3D%22-190%22%20y%3D%22-30%22%20width%3D%222280%22%20height%3D%22360%22%20fill%3D%22rgb%280%25%2C%200%25%2C%200%25%29%22%20fill-opacity%3D%220.5%22%20%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fmask%3E%0A%3CclipPath%20id%3D%22clip-2%22%3E%0A%3Cpath%20clip-rule%3D%22nonzero%22%20d%3D%22M%200.144531%200%20L%20146.710938%200%20L%20146.710938%2086.105469%20L%200.144531%2086.105469%20Z%20M%200.144531%200%20%22%20%2F%3E%0A%3C%2FclipPath%3E%0A%3CclipPath%20id%3D%22clip-3%22%3E%0A%3Crect%20x%3D%220%22%20y%3D%220%22%20width%3D%22147%22%20height%3D%2287%22%20%2F%3E%0A%3C%2FclipPath%3E%0A%3Cg%20id%3D%22source-19%22%20clip-path%3D%22url%28%23clip-3%29%22%3E%0A%3Cg%20clip-path%3D%22url%28%23clip-2%29%22%3E%0A%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%28100%25%2C%20100%25%2C%20100%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%200.144531%20-41.191406%20L%200.144531%2043.789062%20L%200.296875%2043.703125%20L%2073.429688%2086.105469%20L%20146.710938%2043.613281%20L%2073.429688%201.125%20L%2073.277344%201.210938%20L%200.148438%20-41.191406%20Z%20M%200.144531%20-41.191406%20%22%20%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fg%3E%0A%3Cmask%20id%3D%22mask-2%22%3E%0A%3Cg%20filter%3D%22url%28%23filter-remove-color%29%22%3E%0A%3Crect%20x%3D%22-190%22%20y%3D%22-30%22%20width%3D%222280%22%20height%3D%22360%22%20fill%3D%22rgb%280%25%2C%200%25%2C%200%25%29%22%20fill-opacity%3D%220.5%22%20%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fmask%3E%0A%3CclipPath%20id%3D%22clip-4%22%3E%0A%3Cpath%20clip-rule%3D%22nonzero%22%20d%3D%22M%200.582031%200.929688%20L%2073.863281%200.929688%20L%2073.863281%2085.914062%20L%200.582031%2085.914062%20Z%20M%200.582031%200.929688%20%22%20%2F%3E%0A%3C%2FclipPath%3E%0A%3CclipPath%20id%3D%22clip-5%22%3E%0A%3Crect%20x%3D%220%22%20y%3D%220%22%20width%3D%2274%22%20height%3D%2286%22%20%2F%3E%0A%3C%2FclipPath%3E%0A%3Cg%20id%3D%22source-22%22%20clip-path%3D%22url%28%23clip-5%29%22%3E%0A%3Cg%20clip-path%3D%22url%28%23clip-4%29%22%3E%0A%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%2862.353516%25%2C%2080.000305%25%2C%2023.136902%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%2073.863281%200.929688%20L%200.582031%2043.421875%20L%2073.863281%2085.914062%20Z%20M%2073.863281%200.929688%20%22%20%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fg%3E%0A%3Cmask%20id%3D%22mask-3%22%3E%0A%3Cg%20filter%3D%22url%28%23filter-remove-color%29%22%3E%0A%3Crect%20x%3D%22-190%22%20y%3D%22-30%22%20width%3D%222280%22%20height%3D%22360%22%20fill%3D%22rgb%280%25%2C%200%25%2C%200%25%29%22%20fill-opacity%3D%220.699997%22%20%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fmask%3E%0A%3CclipPath%20id%3D%22clip-6%22%3E%0A%3Cpath%20clip-rule%3D%22nonzero%22%20d%3D%22M%200.582031%200%20L%20147.144531%200%20L%20147.144531%20128.597656%20L%200.582031%20128.597656%20Z%20M%200.582031%200%20%22%20%2F%3E%0A%3C%2FclipPath%3E%0A%3CclipPath%20id%3D%22clip-7%22%3E%0A%3Crect%20x%3D%220%22%20y%3D%220%22%20width%3D%22148%22%20height%3D%22129%22%20%2F%3E%0A%3C%2FclipPath%3E%0A%3Cg%20id%3D%22source-25%22%20clip-path%3D%22url%28%23clip-7%29%22%3E%0A%3Cg%20clip-path%3D%22url%28%23clip-6%29%22%3E%0A%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%284.705811%25%2C%2074.902344%25%2C%2085.490417%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20147.144531%20-41.191406%20L%2074.011719%201.210938%20L%2073.863281%201.125%20L%200.582031%2043.613281%20L%200.582031%20128.597656%20L%2073.863281%2086.105469%20L%20146.996094%2043.703125%20L%20147.144531%2043.789062%20Z%20M%20147.144531%20-41.191406%20%22%20%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fg%3E%0A%3CclipPath%20id%3D%22clip-8%22%3E%0A%3Cpath%20clip-rule%3D%22nonzero%22%20d%3D%22M%20443.015625%20255%20L%20590%20255%20L%20590%20300%20L%20443.015625%20300%20Z%20M%20443.015625%20255%20%22%20%2F%3E%0A%3C%2FclipPath%3E%0A%3Cmask%20id%3D%22mask-4%22%3E%0A%3Cg%20filter%3D%22url%28%23filter-remove-color%29%22%3E%0A%3Crect%20x%3D%22-190%22%20y%3D%22-30%22%20width%3D%222280%22%20height%3D%22360%22%20fill%3D%22rgb%280%25%2C%200%25%2C%200%25%29%22%20fill-opacity%3D%220.5%22%20%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fmask%3E%0A%3CclipPath%20id%3D%22clip-9%22%3E%0A%3Cpath%20clip-rule%3D%22nonzero%22%20d%3D%22M%200.015625%200.546875%20L%20146.582031%200.546875%20L%20146.582031%2045%20L%200.015625%2045%20Z%20M%200.015625%200.546875%20%22%20%2F%3E%0A%3C%2FclipPath%3E%0A%3CclipPath%20id%3D%22clip-10%22%3E%0A%3Crect%20x%3D%220%22%20y%3D%220%22%20width%3D%22147%22%20height%3D%2245%22%20%2F%3E%0A%3C%2FclipPath%3E%0A%3Cg%20id%3D%22source-28%22%20clip-path%3D%22url%28%23clip-10%29%22%3E%0A%3Cg%20clip-path%3D%22url%28%23clip-9%29%22%3E%0A%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%28100%25%2C%20100%25%2C%20100%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%2073.300781%200.546875%20L%200.015625%2043.035156%20L%2073.296875%2085.527344%20L%2073.300781%2085.527344%20L%20146.582031%2043.035156%20Z%20M%2073.300781%200.546875%20%22%20%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fg%3E%0A%3Cmask%20id%3D%22mask-5%22%3E%0A%3Cg%20filter%3D%22url%28%23filter-remove-color%29%22%3E%0A%3Crect%20x%3D%22-190%22%20y%3D%22-30%22%20width%3D%222280%22%20height%3D%22360%22%20fill%3D%22rgb%280%25%2C%200%25%2C%200%25%29%22%20fill-opacity%3D%220.5%22%20%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fmask%3E%0A%3CclipPath%20id%3D%22clip-11%22%3E%0A%3Cpath%20clip-rule%3D%22nonzero%22%20d%3D%22M%200.300781%200.421875%20L%20146.863281%200.421875%20L%20146.863281%20170.339844%20L%200.300781%20170.339844%20Z%20M%200.300781%200.421875%20%22%20%2F%3E%0A%3C%2FclipPath%3E%0A%3CclipPath%20id%3D%22clip-12%22%3E%0A%3Crect%20x%3D%220%22%20y%3D%220%22%20width%3D%22147%22%20height%3D%22171%22%20%2F%3E%0A%3C%2FclipPath%3E%0A%3Cg%20id%3D%22source-31%22%20clip-path%3D%22url%28%23clip-12%29%22%3E%0A%3Cg%20clip-path%3D%22url%28%23clip-11%29%22%3E%0A%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%280.392151%25%2C%2063.922119%25%2C%2086.66687%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%2073.582031%200.421875%20L%200.449219%2042.824219%20L%200.300781%2042.738281%20L%200.300781%20127.71875%20L%2073.582031%20170.210938%20L%20146.863281%20127.71875%20L%20146.863281%2042.738281%20L%20146.714844%2042.824219%20Z%20M%2073.804688%20170.339844%20L%20146.863281%20127.976562%20Z%20M%2073.804688%20170.339844%20%22%20%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fg%3E%0A%3C%2Fdefs%3E%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%2815.293884%25%2C%2035.68573%25%2C%2053.334045%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20882.710938%20128.421875%20L%20882.710938%20213.402344%20L%20955.992188%20170.914062%20L%20955.992188%2085.929688%20Z%20M%20882.710938%20128.421875%20%22%20%2F%3E%0A%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%280.392151%25%2C%2063.922119%25%2C%2086.66687%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20955.992188%20170.738281%20L%20882.710938%20213.230469%20L%20955.992188%20255.71875%20L%201029.125%20213.316406%20L%201029.273438%20213.402344%20L%201029.273438%20128.421875%20L%20955.992188%2085.929688%20Z%20M%20955.992188%20170.738281%20%22%20%2F%3E%0A%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%2862.353516%25%2C%2080.000305%25%2C%2023.136902%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20882.710938%2043.613281%20L%20955.992188%2086.105469%20L%20955.992188%201.125%20Z%20M%20882.710938%2043.613281%20%22%20%2F%3E%0A%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%28100%25%2C%20100%25%2C%20100%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20736.167969%20213.191406%20L%20735.921875%20213.617188%20L%20662.863281%20255.976562%20L%20735.921875%20298.339844%20L%20736.078125%20298.171875%20L%20809.40625%20255.757812%20L%20809.496094%20170.777344%20Z%20M%20736.167969%20213.191406%20%22%20%2F%3E%0A%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%284.705811%25%2C%2074.902344%25%2C%2085.490417%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20882.710938%2043.613281%20L%20809.578125%2086.019531%20L%20809.429688%2085.929688%20L%20809.429688%20170.914062%20L%20882.710938%20213.402344%20L%20882.710938%20128.597656%20L%20955.992188%2086.105469%20Z%20M%20882.710938%2043.613281%20%22%20%2F%3E%0A%3Cg%20mask%3D%22url%28%23mask-1%29%22%3E%0A%3Cuse%20xlink%3Ahref%3D%22%23source-19%22%20transform%3D%22matrix%281%2C%200%2C%200%2C%201%2C%20736%2C%200%29%22%20%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%284.705811%25%2C%2074.902344%25%2C%2085.490417%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20809.425781%200%20L%20809.425781%201.296875%20L%20882.710938%2043.789062%20L%20882.710938%200%20Z%20M%20809.425781%200%20%22%20%2F%3E%0A%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%280.392151%25%2C%2063.922119%25%2C%2086.66687%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20882.710938%200%20L%20882.710938%2043.789062%20L%20955.992188%201.296875%20L%20955.992188%200%20Z%20M%20882.710938%200%20%22%20%2F%3E%0A%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%284.705811%25%2C%2074.902344%25%2C%2085.490417%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20589.804688%20298.164062%20L%20592.96875%20300%20L%20662.863281%20300%20L%20662.863281%20255.804688%20Z%20M%20589.804688%20298.164062%20%22%20%2F%3E%0A%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%2862.353516%25%2C%2080.000305%25%2C%2023.136902%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20662.863281%20300%20L%20732.761719%20300%20L%20735.921875%20298.164062%20L%20662.863281%20255.804688%20Z%20M%20662.863281%20300%20%22%20%2F%3E%0A%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%2815.293884%25%2C%2035.68573%25%2C%2053.334045%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20736.144531%20213.230469%20L%20662.863281%20170.738281%20L%20662.863281%20255.71875%20Z%20M%20736.144531%20213.230469%20%22%20%2F%3E%0A%3Cg%20mask%3D%22url%28%23mask-2%29%22%3E%0A%3Cuse%20xlink%3Ahref%3D%22%23source-22%22%20transform%3D%22matrix%281%2C%200%2C%200%2C%201%2C%20589%2C%2085%29%22%20%2F%3E%0A%3C%2Fg%3E%0A%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%286.274414%25%2C%2028.234863%25%2C%2047.842407%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20662.863281%2085.929688%20L%20662.863281%20170.914062%20L%20736.144531%20213.402344%20L%20736.144531%20128.421875%20Z%20M%20662.863281%2085.929688%20%22%20%2F%3E%0A%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%2815.293884%25%2C%2035.68573%25%2C%2053.334045%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20809.277344%2086.019531%20L%20736.144531%2043.617188%20L%20662.863281%2086.105469%20L%20736.144531%20128.597656%20L%20736.144531%20213.402344%20L%20809.429688%20170.914062%20L%20809.429688%2085.929688%20Z%20M%20809.277344%2086.019531%20%22%20%2F%3E%0A%3Cg%20mask%3D%22url%28%23mask-3%29%22%3E%0A%3Cuse%20xlink%3Ahref%3D%22%23source-25%22%20transform%3D%22matrix%281%2C%200%2C%200%2C%201%2C%20589%2C%200%29%22%20%2F%3E%0A%3C%2Fg%3E%0A%3Cg%20clip-path%3D%22url%28%23clip-8%29%22%3E%0A%3Cg%20mask%3D%22url%28%23mask-4%29%22%3E%0A%3Cuse%20xlink%3Ahref%3D%22%23source-28%22%20transform%3D%22matrix%281%2C%200%2C%200%2C%201%2C%20443%2C%20255%29%22%20%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fg%3E%0A%3Cg%20mask%3D%22url%28%23mask-5%29%22%3E%0A%3Cuse%20xlink%3Ahref%3D%22%23source-31%22%20transform%3D%22matrix%281%2C%200%2C%200%2C%201%2C%20516%2C%20128%29%22%20%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
#theme-modern body {
  background-image:
    linear-gradient(to right,
      transparent calc(50% - 440px),
      var(--icen-pale) calc(50% - 400px),
      var(--icen-pale) calc(50% + 400px),
      transparent calc(50% + 440px)),
    var(--icen-motif-artwork),
    var(--icen-motif-artwork);
  background-size: 100% 100%, var(--icen-motif-width) auto, var(--icen-motif-width) auto;
  background-position: center top, left -64px top 160px, right -64px top 660px;
  background-repeat: no-repeat, repeat-y, repeat-y;
  background-attachment: scroll;
}
/* Keep the canvas visible through the existing outer layout containers.
   The white form cards and the custom header retain their own backgrounds. */
#theme-modern .body-content,
#theme-modern .main-form,
#theme-modern .modern-page,
#theme-modern .modern-page-content {
  background-color: transparent;
}
/* Small screens have little outer margin, so leave a clean pale blue canvas. */
@media (max-width: 900px) {
  #theme-modern body { background-image: none; }
}
@media print, (forced-colors: active) {
  #theme-modern body { background-image: none; }
}

#theme-modern .modern-page-content { gap: 20px; }
#theme-modern .modern-panel {
  background-color: #FFFFFF;
  border: 1px solid var(--icen-line);
  border-radius: 24px;
  padding: 32px;
  box-shadow: none;
}

/* 2. Display the full banner artwork at its original proportions. */
#theme-modern .brand-header,
#theme-modern .brand-header > .header {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  background-color: var(--icen-navy);
}
#theme-modern .brand-header .header-image {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center;
}

/* 3. Native EA headings, without overriding the custom HTML header. */
#theme-modern .modern-heading,
#theme-modern .modern-panel > h2,
#theme-modern .modern-panel > h3 {
  font-family: var(--icen-heading);
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: -0.025em;
  color: var(--icen-navy);
  overflow-wrap: break-word;
}
#theme-modern h1.modern-heading { font-size: 26px; }
#theme-modern .modern-panel > h2 { font-size: 20px; }
#theme-modern .modern-panel > h3 { font-size: 18px; }

#theme-modern .modern-panel .theme-modern-label {
  font-family: var(--icen-body);
  font-size: 16px;
  line-height: 24px;
  font-weight: 600;
  color: var(--icen-ink);
  overflow-wrap: break-word;
}

/* 4. Put field labels above controls.
   Change direction, not display: EA retains control of conditional visibility.
   Only rows with an immediate label container are affected. */
#theme-modern .modern-panel .input-container:has(> .modern-input-label-container) {
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
}
#theme-modern .modern-panel .input-container > .modern-input-label-container {
  width: 100% !important;
  max-width: 100%;
  flex: 0 0 auto;
  align-self: stretch;
  margin: 0;
  gap: 6px;
}
#theme-modern .modern-panel .input-container > .modern-input-field-wrapper {
  width: 100% !important;
  max-width: 100%;
  min-width: 0;
  flex: 0 0 auto;
}
#theme-modern .modern-panel .modern-option .modern-input-label-container {
  min-width: 0;
  flex: 1 1 auto;
}

/* Never target all input/select elements: EA hides native dropdown proxies.
   Keep existing horizontal input padding so any built-in icons remain clear. */
#theme-modern .modern-panel input.theme-textbox:not([type="hidden"]),
#theme-modern .modern-panel textarea.theme-textbox,
#theme-modern .modern-panel .ss-main.theme-select {
  box-sizing: border-box;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 50px;
  border-radius: 10px;
  font-family: var(--icen-body);
  font-size: 17px;
  line-height: 26px;
  color: var(--icen-ink);
}
#theme-modern .modern-panel input.theme-textbox:not([type="hidden"]) {
  padding-top: 11px;
  padding-bottom: 11px;
}
#theme-modern .modern-panel textarea.theme-textbox {
  min-height: 144px;
  padding: 14px 16px;
  resize: vertical;
}
#theme-modern .modern-panel .ss-main.theme-select {
  height: auto;
  padding-top: 9px;
  padding-bottom: 9px;
}
#theme-modern .modern-panel .theme-textbox::placeholder {
  color: var(--icen-muted);
  opacity: 1;
}
#theme-modern .modern-panel .theme-textbox:focus-visible,
#theme-modern .modern-panel .ss-main:focus-visible {
  outline: 3px solid var(--icen-navy);
  outline-offset: 3px;
}
/* Reinforce semantic/Bootstrap error borders, without hiding messages. */
#theme-modern .modern-panel .theme-textbox[aria-invalid="true"],
#theme-modern .modern-panel .has-error .theme-textbox,
#theme-modern .modern-panel .has-error .ss-main {
  border-color: #B42318 !important;
}

/* 5. Flatter, clearer selection rows; original controls and labels retained. */
#theme-modern .modern-panel .modern-option {
  box-sizing: border-box;
  min-height: 54px;
  padding: 14px 16px;
  border: 1px solid var(--icen-field-border);
  border-radius: 12px;
  background-color: #FFFFFF;
  box-shadow: none;
  align-items: flex-start;
  transition: background-color 0.18s ease, border-color 0.18s ease;
}
#theme-modern .modern-panel .modern-option .checkbox {
  flex-shrink: 0;
  margin-top: 2px;
}
#theme-modern .modern-panel .modern-option .theme-modern-label {
  font-size: 16px;
  line-height: 24px;
}
#theme-modern .modern-panel .modern-checkbox-box {
  border-color: var(--icen-field-border);
}
#theme-modern .modern-panel input:checked + .modern-checkbox-box {
  background-color: var(--icen-navy);
  border-color: var(--icen-navy);
}
#theme-modern .modern-panel .modern-option:has(input:checked) {
  background-color: var(--icen-soft);
  border-color: var(--icen-navy);
}
#theme-modern .modern-panel .modern-option:has(input:focus-visible) {
  outline: 3px solid var(--icen-navy);
  outline-offset: 3px;
}
#theme-modern .modern-panel .modern-option:has(input:disabled) {
  cursor: not-allowed;
}

/* 6. Upload and consent panels. Do not turn upload areas into pill buttons. */
#theme-modern .modern-panel .add-photo-container,
#theme-modern .modern-panel .add-photo-container > .flex-column-center {
  width: 100%;
  max-width: 100%;
}
#theme-modern .modern-panel .theme-photo-btn-box {
  box-sizing: border-box;
  width: 100%;
  min-height: 132px;
  padding: 24px;
  border: 1px dashed var(--icen-field-border);
  border-radius: 16px;
  background-color: var(--icen-pale);
  color: var(--icen-navy);
  font-family: var(--icen-body);
  box-shadow: none;
}
#theme-modern .modern-panel .theme-photo-btn-box:focus-visible {
  outline: 3px solid var(--icen-navy);
  outline-offset: 4px;
}
#theme-modern .modern-panel .emphasized-switch {
  border: 1px solid var(--icen-field-border);
  border-radius: 12px;
  padding: 16px;
  box-shadow: none;
}
#theme-modern .modern-panel .switch .label-text {
  font-family: var(--icen-body);
  font-size: 16px;
  line-height: 24px;
  font-weight: 600;
}
#theme-modern .modern-panel .switch input:checked + .slider {
  background-color: var(--icen-navy);
}
#theme-modern .modern-panel .switch:has(input:focus-visible) {
  outline: 3px solid var(--icen-navy);
  outline-offset: 5px;
}

/* 7. Navigation actions: soft secondary, cyan primary, green final submit. */
#theme-modern .navbar-buttons-container {
  padding: 20px 16px;
  border-top: 1px solid var(--icen-line);
}
#theme-modern .navbar-buttons {
  width: min(800px, 100%);
  gap: 12px;
}
#theme-modern .navbar-buttons .btn {
  --icen-action-bg: var(--icen-soft);
  --icen-action-text: var(--icen-navy);
  --icen-action-border: var(--icen-navy);
  --icen-action-hover: #B8E4E8;
  box-sizing: border-box;
  min-height: 50px;
  padding: 12px 26px;
  border: 1px solid var(--icen-action-border) !important;
  border-radius: 999px !important;
  background-color: var(--icen-action-bg) !important;
  color: var(--icen-action-text) !important;
  font-family: var(--icen-body);
  font-size: 17px;
  line-height: 24px;
  font-weight: 600;
  white-space: normal;
  text-decoration: none;
  box-shadow: none;
  transition: background-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}
#theme-modern .navbar-buttons .theme-btn-primary {
  --icen-action-bg: var(--icen-blue);
  --icen-action-text: var(--icen-ink);
  --icen-action-border: var(--icen-navy);
  --icen-action-hover: #71C9D1;
}
#theme-modern .navbar-buttons .form-submit {
  --icen-action-bg: var(--icen-green);
  --icen-action-text: var(--icen-ink);
  --icen-action-border: var(--icen-navy);
  --icen-action-hover: #AED052;
}
#theme-modern .navbar-buttons .btn:focus-visible {
  outline: 3px solid var(--icen-navy);
  outline-offset: 4px;
}
#theme-modern .navbar-buttons .btn:is(:disabled, .disabled, [aria-disabled="true"]) {
  --icen-action-bg: #E4ECEF;
  --icen-action-text: var(--icen-muted);
  --icen-action-border: #B2C4CB;
  opacity: 1;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

/* Hover feedback only on devices with a genuine hover pointer. */
@media (hover: hover) and (pointer: fine) {
  #theme-modern .modern-panel .modern-option:not(:has(input:checked)):not(:has(input:disabled)):hover {
    background-color: var(--icen-pale);
    border-color: var(--icen-navy);
  }
  #theme-modern .navbar-buttons .btn:not(:disabled):not(.disabled):not([aria-disabled="true"]):hover {
    background-color: var(--icen-action-hover) !important;
    transform: translateY(-2px);
    box-shadow: 0 5px 12px rgba(0, 79, 126, 0.12);
  }
}

/* 8. Finish the custom HTML header as one clearly defined rounded card.
   Targets the existing header's two direct panels only. */
#theme-modern .icen-form-header {
  border: 1px solid #CBDDE2;
  border-radius: 24px;
  background-color: #FFFFFF;
  box-shadow: 0 8px 24px rgba(0, 79, 126, 0.07);
}
#theme-modern .icen-form-header > div:first-child {
  border-radius: 23px 23px 0 0 !important;
}
#theme-modern .icen-form-header > div:last-child {
  background-color: #FFFFFF !important;
  border-radius: 0 0 23px 23px !important;
}

/* 9. Smaller screens and reduced-motion preferences. */
@media (max-width: 600px) {
  #theme-modern .modern-panel { padding: 24px 20px; border-radius: 20px; }
  #theme-modern h1.modern-heading { font-size: 23px; }
  #theme-modern .modern-panel > h2 { font-size: 19px; }
  #theme-modern .modern-panel .modern-option { padding: 13px 14px; }
  #theme-modern .navbar-buttons,
  #theme-modern .navbar-buttons .left-side-buttons,
  #theme-modern .navbar-buttons .right-side-buttons {
    flex-wrap: wrap;
    gap: 12px;
  }
  #theme-modern .navbar-buttons .right-side-buttons { flex: 1 1 100%; }
  #theme-modern .navbar-buttons .right-side-buttons .btn { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  #theme-modern .modern-panel .modern-option,
  #theme-modern .navbar-buttons .btn {
    transition: none !important;
    transform: none !important;
  }
}

