/** Fonts */
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");

/** Variables */
:root {
  /** Colors */
  --white-dark: #ffffff1f;
  --white-light: #ffffffb3;
  --white: #ffffff;
  --gray000: #f8f9fb;
  --gray100: #f1f3f5;
  --gray200: #E8ECEF;
  --gray300: #DEE2E6;
  --gray400: #CED4DA;
  --gray500: #ADB5BD;
  --gray600: #868e96;
  --gray700: #495057;
  --gray800: #343A40;
  --gray900: #212529;
  --gray999: #000000; 
  --primary: #0c2959;
  --primary-hover: #0b2247;
  --secondary: #566bda;
  --bg-footer-shortcuts: #111111;
  --bg-footer: #161616;
  --fg-copyright: #666666;
  --fg-info-label: #656565;
  --fg-gnb-label: #ffffff66;

  /** Sizes*/
  --mw-container: 87.5rem; /* 1400px */
  
  /** Container Padding */
  --container-padding-desktop: 2rem; /* 32px */
  --container-padding-tablet: 1.5rem; /* 24px */
  --container-padding-mobile: 1rem; /* 16px */

  /** Fonts */
  --ft-default: "Pretendard", sans-serif;
  --ft-en: "Montserrat", sans-serif;

  /** Breakpoints */
  --bp-mobile: 767px;
  --bp-tablet: 1023px;
  --bp-desktop: 1024px;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
  font-size: 1rem;
  font-weight: 400;
  font-family: var(--ft-default);
}

/* Global Container Styles */
.container {
  width: 100%;
  max-width: var(--mw-container);
  margin: 0 auto;
  padding: 0 var(--container-padding-desktop);
}

/* Content Width Control */
.content-wrapper {
  width: 100%;
  padding: 0 var(--container-padding-desktop);
}

/* Ensure all major sections have proper padding */
main,
section,
article,
footer {
  width: 100%;
}

/* Prevent content from touching edges */
.content,
.page-content,
.site-content {
  padding-left: var(--container-padding-desktop);
  padding-right: var(--container-padding-desktop);
}

/* Ensure footer sections maintain padding */
footer > div {
  box-sizing: border-box;
}

h1 { font-size: 2.75rem; }
h2 { font-size: 2.1875rem; }
h3 { font-size: 2.1875rem; }
h4 { font-size: 1.5625rem; }
h5 { font-size: 1.375rem; }
h6 { font-size: 1.25rem; }

body[data-type="main"] h2 {
  color: var(--gray999);
  font-weight: 700;
}

input, select, label {
  color: var(--gray999, #000);
  font-family: var(--ft-default);
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.00875rem;
}

select {
  border-radius: 0.375rem;
  border: 1px solid var(--gray300, #DEE2E6);
  padding: 0.56rem 0.75rem;
  padding-right: 2rem;

  appearance: none; /* Hide default arrow */
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url(/virex-blog/wp-content/uploads/2025/04/icon-arrow-right.svg); /* Custom dropdown arrow */
  background-repeat: no-repeat;
  background-position: right 0.75rem center; /* Adjust right padding */
  background-size: 0.5rem;
}

/* Custom Checkbox Styles */
input[type="checkbox"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 1.1875rem; /* 19px */
  height: 1.1875rem;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 0.25rem; /* 4px */
  cursor: pointer;
  position: relative;
  margin: 0;
}

input[type="checkbox"]:checked {
  background-color: var(--secondary);
  border-color: rgba(0, 0, 0, 0.1);
  background-image: url(/virex-blog/wp-content/uploads/2025/04/icon-close.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1rem 1rem; /* 11px 9px */
}

/* Custom Radio Button Styles */
input[type="radio"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 1.1875rem; /* 19px */
  height: 1.1875rem;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  cursor: pointer;
  position: relative;
  margin: 0;
}

input[type="radio"]:checked {
  background-color: var(--secondary);
  border-color: rgba(0, 0, 0, 0.1);
  background-image: url(/virex-blog/wp-content/uploads/2025/04/icon-close.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1rem 1rem;
}

.btn-clickable { cursor: pointer; }

.mt-10px { margin-top: 0.625rem !important; }
.mt-12px { margin-top: 0.75rem !important; }
.mt-14px { margin-top: 0.875rem !important; }
.mt-16px { margin-top: 1rem !important; }
.mt-18px { margin-top: 1.125rem !important; }
.mt-20px { margin-top: 1.25rem !important; }
.mt-22px { margin-top: 1.375rem !important; }
.mt-24px { margin-top: 1.5rem !important; }
.mt-26px { margin-top: 1.625rem !important; }
.mt-28px { margin-top: 1.75rem !important; }
.mt-30px { margin-top: 1.875rem !important; }
.mt-32px { margin-top: 2rem !important; }
.mt-34px { margin-top: 2.125rem !important; }
.mt-36px { margin-top: 2.25rem !important; }
.mt-37px { margin-top: 2.3125rem !important; }
.mt-38px { margin-top: 2.375rem !important; }
.mt-40px { margin-top: 2.5rem !important; }
.mt-42px { margin-top: 2.625rem !important; }
.mt-44px { margin-top: 2.75rem !important; }
.mt-46px { margin-top: 2.875rem !important; }
.mt-48px { margin-top: 3rem !important; }
.mt-50px { margin-top: 3.125rem !important; }
.mt-60px { margin-top: 3.75rem !important; }
.mt-64px { margin-top: 4rem !important; }
.mt-80px { margin-top: 5rem !important; }
.mt-84px { margin-top: 5.25rem !important; }
.mt-100px { margin-top: 6.25rem !important; }
.mt-112px { margin-top: 7rem !important; }
.mt-140px { margin-top: 8.75rem !important; }
.mt-150px { margin-top: 9.375rem !important; }
.mt-176px { margin-top: 11rem !important; }
.mt-200px { margin-top: 12.5rem !important; } 
.mt-232px { margin-top: 14.5rem !important; }
.mt-250px { margin-top: 16.25rem !important; }

.purple { color: var(--secondary); }

.full-width { width: 100% !important; }
.w-100p { width: 100%; }

.justify-center { justify-content: center !important; }
.center-aligned { text-align: center; }
