{{!-- Player Privacy Panel --}}
<div class="player-privacy-panel__container">
  <div class="player-privacy-panel__body">
    {{#if isReadOnly}}
    <div class="player-privacy-panel__notice player-privacy-panel__notice--readonly">
      {{readOnlyNotice}}
    </div>
    {{/if}}

    <section class="player-privacy-panel__section">
      <h3 class="player-privacy-panel__section-header">{{sectionHeader}}</h3>
      
      <p class="player-privacy-panel__section-description">
        {{localize "SCRYING_POOL.PrivacyPanel.sectionDescription"}}
      </p>

      <div class="player-privacy-panel__effects-list">
        {{#each automationEffects}}
        <div class="player-privacy-panel__effect">
          <div class="player-privacy-panel__effect-header">
            <h4 class="player-privacy-panel__effect-label">{{label}}</h4>
            <div class="player-privacy-panel__toggle">
              <label class="player-privacy-panel__toggle-label"
                     data-tooltip="{{description}}">
                <input 
                  type="checkbox" 
                  {{#if enabled}}checked{{/if}}
                  {{#if ../isReadOnly}}disabled{{/if}}
                  data-setting="{{settingKey}}"
                  class="player-privacy-panel__toggle-input"
                  aria-label="{{label}}"
                >
                <span class="player-privacy-panel__toggle-text">
                  {{#if enabled}}
                    <i class="fas fa-check" aria-hidden="true"></i>
                    {{../toggleOnLabel}}
                  {{else}}
                    <i class="fas fa-times" aria-hidden="true"></i>
                    {{../toggleOffLabel}}
                  {{/if}}
                </span>
              </label>
            </div>
          </div>
          <p class="player-privacy-panel__effect-description">{{description}}</p>
        </div>
        {{/each}}
      </div>
    </section>

    {{#if hasPortraitSection}}
    <section class="player-privacy-panel__section">
      <h3 class="player-privacy-panel__section-header">{{portraitLabel}}</h3>
      <p class="player-privacy-panel__section-description">{{portraitDescription}}</p>

      <div class="player-privacy-panel__portrait-container">
        <div class="player-privacy-panel__portrait-preview">
          {{#if portraitPreviewURL}}
          <img src="{{portraitPreviewURL}}" alt="Portrait preview" class="player-privacy-panel__portrait-image" />
          {{else}}
          <img src="icons/svg/mystery-man.svg" alt="Portrait preview" class="player-privacy-panel__portrait-image" />
          {{/if}}
        </div>

        {{#unless isReadOnly}}
        <div class="player-privacy-panel__portrait-actions">
          <button type="button" 
                  class="player-privacy-panel__portrait-choose sp-btn sp-btn--primary"
                  data-tooltip="{{chooseImageLabel}}">
            <i class="fas fa-image" aria-hidden="true"></i>
            {{chooseImageLabel}}
          </button>
          <input 
            type="file" 
            accept=".png,.jpg,.jpeg,.webp,.gif"
            class="player-privacy-panel__portrait-input"
            style="display: none;"
          >
          {{#if hasCustomPortrait}}
          <button type="button" 
                  class="player-privacy-panel__portrait-remove sp-btn sp-btn--secondary"
                  data-tooltip="{{removeImageLabel}}">
            <i class="fas fa-trash-alt" aria-hidden="true"></i>
            {{removeImageLabel}}
          </button>
          {{/if}}
        </div>
        {{/unless}}
      </div>
    </section>
    {{/if}}
  </div>
</div>