/* ========================================
   Self-hosted Fonts
   M PLUS 1p - japanese_latin
======================================== */

/* m-plus-1p-regular - japanese_latin */
@font-face {
  font-display: swap;
  font-family: 'M PLUS 1p';
  font-style: normal;
  font-weight: 400;
  src: url('/wp-content/themes/bakuage-theme/assets/fonts/m-plus-1p-v33-japanese_latin-regular.woff2') format('woff2');
}

/* m-plus-1p-500 - japanese_latin */
@font-face {
  font-display: swap;
  font-family: 'M PLUS 1p';
  font-style: normal;
  font-weight: 500;
  src: url('/wp-content/themes/bakuage-theme/assets/fonts/m-plus-1p-v33-japanese_latin-500.woff2') format('woff2');
}

/* m-plus-1p-700 - japanese_latin */
@font-face {
  font-display: swap;
  font-family: 'M PLUS 1p';
  font-style: normal;
  font-weight: 500;
  src: url('/wp-content/themes/bakuage-theme/assets/fonts/m-plus-1p-v33-japanese_latin-700.woff2') format('woff2');
}

/* ========================================
   CSS Custom Properties (Variables)
   テーマ全体で使用する色の定義
======================================== */

:root {
  /* ========================================
     Brand Colors
  ======================================== */
  --color-primary: #FF4000;
  --color-primary-hover: #E63900;
  --color-secondary: #0075DE;
  --color-gradient-end: #FFB800;

  /* ========================================
     Text Colors
  ======================================== */
  --color-text-primary: #191919;
  --color-text-secondary: #6F6F6F;
  --color-text-black: #000000;
  --color-text-white: #FFFFFF;

  /* ========================================
     Background Colors
  ======================================== */
  --color-bg-body: #F8FCFC;
  --color-bg-white: #FFFFFF;
  --color-bg-cream: #FEFCF9;
  --color-bg-light: #E4E4E4;
  --color-bg-card-shipping: #FFDBCD;
  --color-bg-card-refund: #FCFEF1;
  --color-bg-card-address: #ECF6FF;
  --color-bg-icon-box: #F6F5F4;

  /* ========================================
     Border Colors
  ======================================== */
  --color-border-light: #E5E5E5;
  --color-border-medium: #CBCBCB;
  --color-border-primary: #FF4000;

  /* ========================================
     Gradients
  ======================================== */
  --gradient-primary: linear-gradient(135deg, #FF4000 0%, #FFB800 100%);

  /* ========================================
     Alpha Colors (透明度付き)
  ======================================== */
  --color-primary-alpha-10: rgba(255, 64, 0, 0.1);
  --color-black-alpha-02: rgba(0, 0, 0, 0.02);
  --color-black-alpha-05: rgba(0, 0, 0, 0.05);
  --color-white-alpha-30: rgba(255, 255, 255, 0.3);

  /* ========================================
   Colors (色)
  ======================================== */
  --color-white: #FFFFFF;

  /* ========================================
     Z-Index Scale
  ======================================== */
  --z-index-footer-fixed: 1000;
  --z-index-header: 2000;
}