/**
 * (C) Copyright Mindus SARL, 2026.
 * All rights reserved.
 *
 * CSS for pop-up dialog box or scrollable list selection support regardless of Dojo and Themes,
 * with mobile support.
 *
 * Restyled on the platform tokens of iz/css/iiziThemes.css (THEME-DESIGN.md section 4.3, phase
 * A2a): every themed value is var(--iz-<token>,<literal>), the literal being the IIZI light
 * value of that token, so a page that does not link the token sheet shows the same look and a
 * page that does takes the chosen family and mode. The box and its buttons are rounded (--iz-r2,
 * --iz-r), the frame is a hairline in the divider colour under the --iz-sh2 elevation, the type
 * is the platform's own UI font (--iz-font). The FontAwesome icon font of .izrpIcon is not a
 * theme font and stays; the entry fields keep 16px so that iOS Safari does not zoom into them.
 *
 * @author Christopher Mindus
 */

/* Cover */
.izrpCover
 {
 background-color:var(--iz-scrim,rgba(0,0,0,.4));
 opacity:0;
 position:absolute;
 top:0;
 left:0;
 width:100%;
 height:100%;
 z-index:10000;/*/2147483646; /* (Max-1) of signed 32-bit integer */
 pointer-events:auto;
 -webkit-transition:opacity var(--iz-dur,.16s);
         transition:opacity var(--iz-dur,.16s);
 }

/* Blur effect on body */
.izrpBlur > *:not(.izrpCover)
 {
 -webkit-transition:all var(--iz-dur,.16s);
         transition:all var(--iz-dur,.16s);
         filter:url(#_izrpBlur_);
 -webkit-filter:blur(2px);
         /* @alternate */
         filter:blur(2px);
 }
.izrpUnblur > *:not(.izrpCover)
 {
 -webkit-transition:all var(--iz-dur,.16s);
         transition:all var(--iz-dur,.16s);
 -webkit-filter:blur(0px)!important;
         filter:blur(0px)!important;
 }

/* Cover fades in */
.izrpShow .izrpCover
  {
  opacity:1;
  }

/* Centering */
.izrpOuter
 {
 position:absolute;
 left:0;
 top:0;
 width:100%;
 height:60%;

 /* @alternate */
 height:60vh;

 display:-webkit-flex;
 display:flex;
 align-items:center;
 justify-content:center;
 }

.izrpOuter.izrpCenter
 {
 height:100%;
 }

/* Dialog */
.izrpInner
 {
 pointer-events:auto;
 margin:auto;
 display:block;
 color:var(--iz-fg,#212121);
 font:var(--iz-fs,14px)/var(--iz-lh,1.4) var(--iz-font,system-ui,-apple-system,"Segoe UI Variable","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif);
 background-color:var(--iz-bg2,#f5f5f5);
 border:var(--iz-bw,1px) solid var(--iz-div,#bdbdbd);
 border-radius:var(--iz-r2,12px);
 box-shadow:var(--iz-sh2,0 8px 32px rgba(0,0,0,.18));
 max-width:85%;
 overflow-y:auto;
 overflow-x:hidden;
 scroll-behavior:smooth;
 }
.izrpCenter .izrpInner
 {
 max-height:90%;
 }

/* Table and list */
.izrpTable
 {
 border-spacing:var(--iz-sp,8px);
 border:0;
 margin:var(--iz-sp,8px) 16px 16px 16px;
 }
.izrpTableList
 {
 border-spacing:0;
 color:var(--iz-fg,#212121);
 }
.izrpTableList td
 {
 font-size:1.15em;
 line-height:1.25em;
 padding:12px 16px;
 vertical-align:middle;
 }
.izrpSep td
 {
 border-top:var(--iz-bw,1px) solid var(--iz-div,#bdbdbd);
 }
td.izrpListIcon
 {
 padding-right:0;
 }
.izrpSel td
 {
 background-color:var(--iz-prs,#e0e0e0);
 }
.izrpTableList table,
.izrpTableList tr,
.izrpTableList td
 {
 -webkit-touch-callout:none;
 -webkit-user-select:none;
    -moz-user-select:none;
     -ms-user-select:none;
         user-select:none;
 }

.izrpTitle
 {
 line-height:1.25;
 font-weight:600;
 font-size:1.3em;
 color:var(--iz-fg,#212121);
 padding-bottom:var(--iz-sp,8px);
 }

.izrpIcon
 {
 color:var(--iz-acc,#0d47a1);
 vertical-align:top;
 padding-top:10px;
 padding-right:10px;
 font:30px FontAwesome;
 }

.izrpHead
 {
 padding:5px 0;
 padding-top:5px;
 }
.izrpMsg
 {
 line-height:var(--iz-lh,1.4);
 }

.izrpPrompt
 {
 padding-right:10px;
 }

/* Buttons */
.izrpButtons
 {
 margin-top:5px;
 }

.izrpOK,
.izrpCancel
 {
 display:inline-block;
 min-width:6em;
 margin-right:var(--iz-sp,8px);
 }

/* Entry fields: 16px, not --iz-fs, or iOS Safari zooms the page into the field on focus */
.izrpTable input
 {
 border:var(--iz-bw,1px) solid var(--iz-bd,#bdbdbd);
 border-radius:var(--iz-r,6px);
 color:var(--iz-fg,#212121);
 background-color:var(--iz-bg3,#eeeeee);
 font:16px var(--iz-font,system-ui,-apple-system,"Segoe UI Variable","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif);
 padding:8px 10px;
 width:100%;
 box-sizing:border-box;
 -webkit-appearance:none;
 }

/* Keyboard focus, fields and buttons alike */
.izrpTable input:focus-visible
 {
 outline:2px solid var(--iz-focus,#1e88e5);
 outline-offset:2px;
 }

.izrpButtons input
 {
 border:var(--iz-bw,1px) solid var(--iz-bd,#bdbdbd);
 border-radius:var(--iz-r,6px);
 -webkit-appearance:none;
 margin-top:var(--iz-sp,8px);
 padding:8px 16px;
 color:var(--iz-fg,#212121);
 background-color:var(--iz-wbg,#ffffff);
 font:inherit;
 cursor:pointer;
 -webkit-transition:background-color var(--iz-dur,.16s),border-color var(--iz-dur,.16s);
         transition:background-color var(--iz-dur,.16s),border-color var(--iz-dur,.16s);
 }
.izrpButtons input:hover
 {
 background-color:var(--iz-hov,#eeeeee);
 }
.izrpButtons input:active
 {
 background-color:var(--iz-prs,#e0e0e0);
 }

/* The default button, the first one, the one Enter answers: filled with the accent */
.izrpOK input
 {
 color:var(--iz-acc-fg,#ffffff);
 background-color:var(--iz-acc,#0d47a1);
 border-color:var(--iz-acc,#0d47a1);
 }
.izrpOK input:hover
 {
 background-color:var(--iz-acc-h,#0b3d89);
 border-color:var(--iz-acc-h,#0b3d89);
 }
.izrpOK input:active
 {
 background-color:var(--iz-acc-p,#093272);
 border-color:var(--iz-acc-p,#093272);
 }

/* OK while a required field is still empty: prompt.js sets the flag, the look is here */
.izrpButtons input:disabled
 {
 color:var(--iz-dis-fg,#757575);
 background-color:var(--iz-dis,#e0e0e0);
 border-color:var(--iz-div,#bdbdbd);
 cursor:default;
 }