/* 
   /wp-content/plugins/audio-file-deletion-manager/css/afdm-style.css
   Audio File Deletion Manager専用のCSS 
   既存の .audio-toggle-button と同等のCSSを、クラス名を変えて定義
*/

.afdm-audio-toggle-button {
    background-color: #ffccf9; /* 背景色 */
    color: #5e3a87;            /* テキスト色 */
    padding: 8px 16px;         /* 内側の余白 */
    border: 2px solid #f6a0c0; /* 縁取り */
    cursor: pointer;
    font-size: 16px;           /* フォントサイズ */
    font-weight: bold;         /* フォントの太さ */
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3); /* テキスト影 */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);    /* ボタン影 */
    transition: background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
    width: 180px;              /* ボタンの幅 */
    text-align: center;        /* テキストを中央揃え */
    white-space: nowrap;       /* テキスト折り返しなし */
    overflow: hidden;
    margin-right: 10px;        /* ボタン間隔(水平) */
    margin-bottom: 10px;       /* ボタン間隔(下) */
  }
  
  .afdm-audio-toggle-button:hover {
    background-color: #f79ac0; /* ホバー時 */
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
    transform: translateY(-2px);
  }
  
  .afdm-audio-toggle-button:active {
    background-color: #f5a6b2; /* クリック時 */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    transform: translateY(0);
  }