@layer powermail-reset, powermail-variables, powermail-form, powermail-field, powermail-field-error;
@layer powermail-variables {
  :root {
    --pm-grey-1: #F2F2F2;
    --pm-grey-2: #DEE2E6;
    --pm-grey-3: #AAAAAA;
    --pm-white: #FFFFFF;
    --pm-black: #212529;
    --pm-blue: #2E6DA4;
    --pm-red: #DC3545;
    --pm-green: #198754;
    --pm-orange: #FFC107;
    --pm-primary-color: var(--pm-blue);
    --pm-secondary-color: var(--pm-grey-2);
    --pm-input-background-color: var(--pm-white);
    --pm-input-border-color: var(--pm-grey-2);
    --pm-input-color: var(--pm-black);
    --pm-input-placeholder-color: var(--pm-grey-3);
    --pm-input-invalid-background-color: var(--pm-input-background-color);
    --pm-input-invalid-border-color: var(--pm-red);
    --pm-input-invalid-color: var(--pm-input-color);
    --pm-select-background-color: var(--pm-white);
    --pm-select-border-color: var(--pm-grey-2);
    --pm-select-color: var(--pm-black);
    --pm-check-background-color: var(--pm-white);
    --pm-check-border-color: var(--pm-grey-2);
    --pm-check-color: var(--pm-primary-color);
    --pm-radio-background-color: var(--pm-white);
    --pm-radio-border-color: var(--pm-grey-2);
    --pm-radio-color: var(--pm-primary-color);
    --pm-button-background-color: transparent;
    --pm-button-color: currentcolor;
    --pm-button-border-color: transparent;
    --pm-button-hover-background-color: transparent;
    --pm-button-hover-border-color: transparent;
    --pm-button-hover-color: currentcolor;
    --pm-button-primary-background-color: var(--pm-primary-color);
    --pm-button-primary-border-color: var(--pm-primary-color);
    --pm-button-primary-color: var(--pm-white);
    --pm-button-primary-hover-background-color: color-mix(in srgb, var(--pm-primary-color), var(--pm-black) 20%);
    --pm-button-primary-hover-border-color: color-mix(in srgb, var(--pm-primary-color), var(--pm-black) 20%);
    --pm-button-primary-hover-color: var(--pm-white);
    --pm-button-secondary-background-color: var(--pm-secondary-color);
    --pm-button-secondary-border-color: var(--pm-secondary-color);
    --pm-button-secondary-color: var(--pm-black);
    --pm-button-secondary-hover-background-color: color-mix(in srgb, var(--pm-secondary-color), var(--pm-black) 20%);
    --pm-button-secondary-hover-border-color: color-mix(in srgb, var(--pm-secondary-color), var(--pm-black) 20%);
    --pm-button-secondary-hover-color: var(--pm-black);
    --pm-button-active-background-color: var(--pm-primary-color);
    --pm-button-active-border-color: var(--pm-primary-color);
    --pm-button-active-color: var(--pm-white);
    --pm-button-active-hover-background-color: color-mix(in srgb, var(--pm-primary-color), var(--pm-black) 20%);
    --pm-button-active-hover-border-color: color-mix(in srgb, var(--pm-primary-color), var(--pm-black) 20%);
    --pm-button-active-hover-color: var(--pm-white);
    --pm-button-warning-background-color: var(--pm-orange);
    --pm-button-warning-border-color: var(--pm-orange);
    --pm-button-warning-color: var(--pm-black);
    --pm-button-warning-hover-background-color: color-mix(in srgb, var(--pm-orange), var(--pm-black) 20%);
    --pm-button-warning-hover-border-color: color-mix(in srgb, var(--pm-orange), var(--pm-black) 20%);
    --pm-button-warning-hover-color: var(--pm-black);
    --pm-button-danger-background-color: var(--pm-red);
    --pm-button-danger-border-color: var(--pm-red);
    --pm-button-danger-color: var(--pm-white);
    --pm-button-danger-hover-background-color: color-mix(in srgb, var(--pm-red), var(--pm-black) 20%);
    --pm-button-danger-hover-border-color: color-mix(in srgb, var(--pm-red), var(--pm-black) 20%);
    --pm-button-danger-hover-color: var(--pm-white);
    --pm-table-thead-tr-background-color: var(--pm-white);
    --pm-table-thead-tr-color: var(--pm-black);
    --pm-table-thead-th-border-color: var(--pm-grey-2);
    --pm-table-tbody-tr-background-color: var(--pm-white);
    --pm-table-tbody-tr-color: var(--pm-black);
    --pm-table-tbody-tr-odd-background-color: var(--pm-grey-1);
    --pm-table-tbody-tr-odd-color: var(--pm-black);
    --pm-table-tbody-tr-hover-background-color: color-mix(in srgb, var(--pm-grey-1), var(--pm-black) 8%);
    --pm-table-tbody-tr-hover-color: var(--pm-black);
    --pm-table-tbody-th-border-color: var(--pm-grey-2);
    --pm-table-tbody-td-border-color: var(--pm-grey-2)
  }
}
@layer powermail-reset {
  .tx-powermail *,
  .tx-powermail *::before,
  .tx-powermail *::after {
    box-sizing:border-box
  }
  .tx-powermail a,
  .tx-powermail button {
    touch-action:manipulation
  }
  .tx-powermail button,
  .tx-powermail input,
  .tx-powermail select,
  .tx-powermail textarea {
    font:inherit;
    line-height:inherit
  }
  .tx-powermail button[disabled],
  .tx-powermail button[aria-disabled=true],
  .tx-powermail input[disabled],
  .tx-powermail input[aria-disabled=true],
  .tx-powermail select[disabled],
  .tx-powermail select[aria-disabled=true],
  .tx-powermail textarea[disabled],
  .tx-powermail textarea[aria-disabled=true] {
    opacity:.5
  }
  .tx-powermail ::file-selector-button {
    font:inherit;
    line-height:inherit
  }
  .tx-powermail label {
    display:inline-block
  }
  .tx-powermail ::placeholder {
    color:var(--pm-input-placeholder-color);
    opacity:1
  }
}
@layer powermail-form {
  .powermail_fieldset {
    border:0;
    margin:0;
    padding:0
  }
  .powermail_fieldset legend {
    font-size:1.125rem;
    margin:0;
    padding:0;
    font-weight:700
  }
  .powermail_fieldset legend+* {
    margin-block-start:1.5rem
  }
  .powermail_fieldset+.powermail_fieldset {
    margin-block-start:1.5rem
  }
}
@layer powermail-form {
  .powermail_message {
    border:.0625rem solid rgba(0,0,0,0);
    padding:1.5rem;
    background-position:calc(100% - 1.5rem) 1.5rem;
    background-repeat:no-repeat;
    background-size:2.5rem;
    position:relative
  }
  .powermail_message>* {
    position:relative;
    z-index:1
  }
  .powermail_message::after {
    block-size:3rem;
    content:"";
    inline-size:3rem;
    inset-block-start:1.5rem;
    inset-inline-end:1.5rem;
    mask-mode:auto;
    mask-position:center;
    mask-repeat:no-repeat;
    mask-size:contain;
    position:absolute
  }
  .powermail_message h2 {
    margin:0
  }
  .powermail_message h2+* {
    margin-block-start:1.5rem
  }
  .powermail_message ol {
    margin-block-end:0;
    margin-inline:0;
    padding-inline-start:1.5rem
  }
  .powermail_message ol>*+* {
    margin-block-start:.5rem
  }
  .powermail_message+* {
    margin-block-start:1.5rem
  }
  .powermail_message_note {
    border-color:var(--pm-orange)
  }
  .powermail_message_note::after {
    mask-image:url("../Image/Icons/check.svg");
    background-color:var(--pm-orange)
  }
  .powermail_message_ok {
    border-color:var(--pm-green)
  }
  .powermail_message_ok::after {
    background-color:var(--pm-green);
    mask-image:url("../Image/Icons/check.svg")
  }
  .powermail_message_error {
    border-color:var(--pm-red)
  }
  .powermail_message_error::after {
    background-color:var(--pm-red);
    mask-image:url("../Image/Icons/error.svg")
  }
}
@layer powermail-form {
  .powermail_morestep .powermail_fieldset {
    margin-block-start:1.5rem
  }
  .powermail_multistep_navigation {
    display:flex;
    gap:.5rem
  }
  .powermail_tab_navigation {
    display:flex;
    gap:.5rem;
    margin-block-start:1.5rem
  }
}
@layer powermail-form {
  .powermail_progressbar {
    block-size:.5rem;
    border:.0625rem solid var(--pm-grey-1);
    inline-size:100%;
    margin-block-start:1.5rem
  }
  .powermail_progressbar.disable {
    display:none
  }
  .powermail_progressbar>.powermail_progress {
    background-color:var(--pm-blue);
    inline-size:0%;
    max-inline-size:100%;
    animation:progress 5s 1 forwards
  }
  .powermail_progressbar>.powermail_progress>.powermail_progress_inner {
    background:url("../Image/icon_loading.gif") repeat-x;
    block-size:.5rem;
    inline-size:100%;
    opacity:.25;
    overflow:hidden
  }
  .powermail_confirmation .powermail_progressbar {
    inline-size:100%
  }
  @keyframes progress {
    from {
      inline-size:0%
    }
    to {
      inline-size:100%
    }
  }
}
@layer powermail-form {
  .tx-powermail table {
    border-collapse:separate;
    border-spacing:0;
    inline-size:100%
  }
  .tx-powermail thead tr {
    background-color:var(--pm-table-thead-tr-background-color);
    color:var(--pm-table-thead-tr-color)
  }
  .tx-powermail thead th {
    border-block-end:.0625rem solid var(--pm-table-thead-th-border-color)
  }
  .tx-powermail th {
    padding:.5rem;
    text-align:start
  }
  .tx-powermail tbody tr {
    background-color:var(--pm-table-tbody-tr-background-color);
    color:var(--pm-table-tbody-tr-color)
  }
  .tx-powermail tbody tr:nth-child(odd) {
    background-color:var(--pm-table-tbody-tr-odd-background-color);
    color:var(--pm-table-tbody-tr-odd-color)
  }
  .tx-powermail tbody tr:hover {
    background-color:var(--pm-table-tbody-tr-hover-background-color);
    color:var(--pm-table-tbody-tr-hover-color)
  }
  .tx-powermail tbody th {
    border-block-end:.0625rem solid var(--pm-table-tbody-th-border-color)
  }
  .tx-powermail tbody td {
    border-block-end:.0625rem solid var(--pm-table-tbody-td-border-color)
  }
  .tx-powermail td {
    padding:.5rem;
    text-align:start
  }
}
@layer powermail-field {
  .powermail_label {
    margin-block-end:.25rem
  }
}
@layer powermail-field {
  .tx-powermail input:not([type=checkbox],
  [type=radio],
  [type=submit],
  [type=reset],
  [type=range],
  [type=hidden]) {
    background-color:var(--pm-input-background-color);
    border-radius:0;
    border:.0625rem solid var(--pm-input-border-color);
    color:var(--pm-input-color);
    inline-size:100%;
    padding-block:.375rem;
    padding-inline:.75rem
  }
  .tx-powermail input:not([type=checkbox],
  [type=radio],
  [type=submit],
  [type=reset],
  [type=range],
  [type=hidden]):user-invalid,
  .tx-powermail input:not([type=checkbox],
  [type=radio],
  [type=submit],
  [type=reset],
  [type=range],
  [type=hidden]).powermail_field_error {
    background-image:url("../Image/Icons/error.svg");
    background-position:calc(100% - .75rem) .375rem;
    background-repeat:no-repeat;
    background-size:1.125rem;
    padding-inline-end:2.625rem
  }
}
@layer powermail-field {
  .powermail_fieldwrap_file_list {
    align-items:flex-start;
    border:.0625rem solid var(--pm-grey-2);
    display:flex;
    flex-direction:column;
    margin-block-start:1.5rem;
    padding:.75rem;
    row-gap:1.5rem
  }
  .powermail_fieldwrap_file_list ul {
    margin:0;
    padding-inline-start:1.5rem
  }
}
@layer powermail-field {
  .tx-powermail select {
    appearance:none;
    background-color:var(--pm-select-background-color);
    border-radius:0;
    border:.0625rem solid var(--pm-select-border-color);
    color:var(--pm-select-color);
    inline-size:100%;
    padding-block:.375rem;
    padding-inline:.75rem
  }
  .tx-powermail select:not([multiple]) {
    background-image:url("../Image/Icons/chevron-down.svg");
    background-position:calc(100% - .5rem) center;
    background-repeat:no-repeat
  }
  .tx-powermail select:user-invalid:not([multiple]),
  .tx-powermail select.powermail_field_error:not([multiple]) {
    background-image:url("../Image/Icons/chevron-down.svg"),url("../Image/Icons/error.svg");
    background-position:calc(100% - 2.625rem) .375rem,calc(100% - .75rem) .375rem;
    background-repeat:no-repeat;
    background-size:1.125rem,1.125rem;
    padding-inline-end:4.5rem
  }
}
@layer powermail-field {
  .powermail_checkwrap {
    align-items:baseline;
    display:grid;
    gap:.5rem;
    grid-template-columns:1.25rem auto;
    justify-items:start
  }
  .powermail_checkwrap+.powermail_checkwrap {
    margin-block-start:.5rem
  }
  .tx-powermail input[type=checkbox] {
    appearance:none;
    background-color:var(--pm-check-background-color);
    block-size:1.25rem;
    border-radius:0;
    border:.0625rem solid var(--pm-check-border-color);
    color:var(--pm-check-color);
    display:grid;
    inline-size:1.25rem;
    margin:0;
    place-content:center
  }
  .tx-powermail input[type=checkbox]::before {
    background-color:CanvasText;
    block-size:1rem;
    box-shadow:inset 1em 1em var(--pm-check-color);
    content:"";
    inline-size:1rem;
    mask-image:url("../Image/Icons/check.svg");
    mask-mode:auto;
    mask-position:center;
    mask-repeat:no-repeat;
    mask-size:contain;
    opacity:0
  }
  .tx-powermail input[type=checkbox]:indeterminate::before,
  .tx-powermail input[type=checkbox][aria-checked=mixed]::before {
    mask-image:url("../Image/Icons/minus.svg")
  }
  .tx-powermail input[type=checkbox]:checked::before {
    opacity:1
  }
}
@layer powermail-field {
  .powermail_radiowrap {
    align-items:baseline;
    display:grid;
    gap:.5rem;
    grid-template-columns:1.25rem auto;
    justify-items:start
  }
  .powermail_radiowrap+.powermail_radiowrap {
    margin-block-start:.5rem
  }
  .tx-powermail input[type=radio] {
    appearance:none;
    background-color:var(--pm-radio-background-color);
    block-size:1.25rem;
    border-radius:50%;
    border:.0625rem solid var(--pm-radio-border-color);
    color:var(--pm-radio-color);
    display:grid;
    inline-size:1.25rem;
    margin:0;
    place-content:center
  }
  .tx-powermail input[type=radio]::before {
    background-color:CanvasText;
    block-size:.5rem;
    border-radius:50%;
    box-shadow:inset 1em 1em var(--pm-radio-color);
    content:"";
    inline-size:.5rem;
    opacity:0
  }
  .tx-powermail input[type=radio]:checked::before {
    opacity:1
  }
}
@layer powermail-field {
  .tx-powermail textarea {
    background-color:var(--pm-input-background-color);
    border-radius:0;
    border:.0625rem solid var(--pm-input-border-color);
    color:var(--pm-input-color);
    inline-size:100%;
    padding-block:.375rem;
    padding-inline:.75rem
  }
  .tx-powermail textarea:user-invalid,
  .tx-powermail textarea.powermail_field_error {
    background-image:url("../Image/Icons/error.svg");
    background-position:calc(100% - .75rem) .375rem;
    background-repeat:no-repeat;
    background-size:1.125rem;
    padding-inline-end:2.625rem
  }
}
@layer powermail-field {
  .tx-powermail input[type=range] {
    inline-size:100%;
    margin-block-end:0;
    margin-inline:0;
    padding:0
  }
}
@layer powermail-field {
  .tx-powermail .btn {
    appearance:none;
    background-color:var(--pm-button-background-color);
    background-image:none;
    border-radius:0;
    border:.0625rem solid var(--pm-button-border-color);
    color:var(--pm-button-color);
    display:inline-flex;
    text-decoration:none
  }
  .tx-powermail .btn:hover,
  .tx-powermail .btn:focus-visible {
    background-color:var(--pm-button-hover-background-color);
    border-color:var(--pm-button-hover-border-color);
    color:var(--pm-button-hover-color)
  }
  .tx-powermail .btn-primary {
    background-color:var(--pm-button-primary-background-color);
    border-color:var(--pm-button-primary-border-color);
    color:var(--pm-button-primary-color);
    padding-block:.375rem;
    padding-inline:.75rem
  }
  .tx-powermail .btn-primary:hover,
  .tx-powermail .btn-primary:focus-visible {
    background-color:var(--pm-button-primary-hover-background-color);
    border-color:var(--pm-button-primary-hover-border-color);
    color:var(--pm-button-primary-hover-color)
  }
  .tx-powermail .btn-secondary {
    background-color:var(--pm-button-secondary-background-color);
    border-color:var(--pm-button-secondary-border-color);
    color:var(--pm-button-secondary-color);
    padding-block:.375rem;
    padding-inline:.75rem
  }
  .tx-powermail .btn-secondary:hover,
  .tx-powermail .btn-secondary:focus-visible {
    background-color:var(--pm-button-secondary-hover-background-color);
    border-color:var(--pm-button-secondary-hover-border-color);
    color:var(--pm-button-secondary-hover-color)
  }
  .tx-powermail .active {
    background-color:var(--pm-button-active-background-color);
    border-color:var(--pm-button-active-border-color);
    color:var(--pm-button-active-color);
    padding-block:.375rem;
    padding-inline:.75rem
  }
  .tx-powermail .active:hover,
  .tx-powermail .active:focus-visible {
    background-color:var(--pm-button-active-hover-background-color);
    border-color:var(--pm-button-active-hover-border-color);
    color:var(--pm-button-active-hover-color)
  }
  .tx-powermail .btn-warning {
    background-color:var(--pm-button-warning-background-color);
    border-color:var(--pm-button-warning-border-color);
    color:var(--pm-button-warning-color);
    padding-block:.375rem;
    padding-inline:.75rem
  }
  .tx-powermail .btn-warning:hover,
  .tx-powermail .btn-warning:focus-visible {
    background-color:var(--pm-button-warning-hover-background-color);
    border-color:var(--pm-button-warning-hover-border-color);
    color:var(--pm-button-warning-hover-color)
  }
  .tx-powermail .btn-danger {
    background-color:var(--pm-button-danger-background-color);
    border-color:var(--pm-button-danger-border-color);
    color:var(--pm-button-danger-color);
    padding-block:.375rem;
    padding-inline:.75rem
  }
  .tx-powermail .btn-danger:hover,
  .tx-powermail .btn-danger:focus-visible {
    background-color:var(--pm-button-danger-hover-background-color);
    border-color:var(--pm-button-danger-hover-border-color);
    color:var(--pm-button-danger-hover-color)
  }
}
@layer powermail-field-error {
  .powermail_field_error,
  .powermail_field_error input[type=radio],
  .powermail_field_error input[type=checkbox],
  :user-invalid,
  :user-invalid input[type=radio],
  :user-invalid input[type=checkbox] {
    background-color:var(--pm-input-invalid-background-color);
    border-color:var(--pm-input-invalid-border-color);
    color:var(--pm-input-invalid-color)
  }
  .powermail_field_error:focus-visible,
  :user-invalid:focus-visible {
    outline:.25rem solid rgba(0,0,0,0);
    box-shadow:0 0 0 .25rem color-mix(in srgb, var(--pm-red), transparent 80%)
  }
  .powermail-errors-list {
    color:var(--pm-red);
    list-style-type:"";
    margin-block:.25rem 0;
    margin-inline:0;
    padding:0
  }
  .powermail-errors-list:not(.filled) {
    display:none
  }
}
.tx-powermail .powermail_fieldwrap+.powermail_fieldwrap {
  margin-block-start:1.5rem
}
.tx-powermail .row+.row {
  margin-block-start:1.5rem;
}
.powermail_fieldset+.powermail_fieldset {
    margin-block-start:1.5rem
  }
.tx_powermail select{
	appearance: revert !important;
}