/* 전체적인 스타일 설정 */

body {
    font-family: Arial, sans-serif, 돋움 ;
    text-align: center;
    /* padding: 0px; */
    /* background-image: url('../../images/background/future.png');
    background-attachment: fixed;  */
    background-size: cover;
    background-position: center;
    background-color: #FFEBEE;

}


/* 둥근 input 필드 스타일 */

input[type="text"],
input[type="email"],
input[type="password"],
input[type="url"],
input[type="file"] {
    width: 90%;
    max-width: 400px;
    padding: 12px;
    margin: 10px 0;
    border: 2px solid #ddd;
    border-radius: 25px; /* 둥근 형태 */
    font-size: 16px;
    outline: none;
    transition: 0.3s;
}

/* a link */
a {
	text-decoration: none;
      /*   text-decoration-line: underline; */
      /*   text-decoration-line: overline; */
      /*   text-decoration-line: line-through; */
      /*   text-decoration-line: underline line-through overline; */
}

/* input 필드 클릭(포커스) 시 효과 */
input:focus {
    border-color: #007bff;
    box-shadow: 0 0 8px rgba(0, 123, 255, 0.2);
}

/* 둥근 버튼 스타일 */
button {
    width: 90%;
    max-width: 400px;
    padding: 12px;
    margin-top: 10px;
    background-color: #FF1493;
    color: white;
    border: none;
    border-radius: 10px; /* 둥근 형태 */
    font-size: 16px;
    cursor: pointer;
    transition: 0.3s;
}

button:hover {
    background-color: #0056b3;
}

.btn-logout {
    padding: 10px 15px;
    background-color: #dc3545;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

.btn-logout:hover {
    background-color: #c82333;
}

/* profile image */
.profile-img { 
	width: 150px; 
	height: 150px; 
	border-radius: 
	50%; 
	object-fit: cover;
}


/* white text box */
.text-box {
	display: inline-block;
	padding: 10px 15px ;
	background-color: #FFFFFF;
	border: 2px solid #222222;
	border-radius: 5px;
	font-size: 16px;
}


/* 기존 스타일은 유지하고 아래에 추가 */

/* SNS 링크들을 담을 컨테이너 */
.sns {
    display: flex;
    flex-direction: column; /* 세로 방향으로 나열 */
    gap: 15px; /* 각 카드 사이의 간격 */
    margin-top: 25px; /* 상단 여백 */
    max-width: 500px; /* 최대 너비 설정 */
    margin-left: auto;
    margin-right: auto;
}

/* 개별 SNS 링크 카드 스타일 */
.sns-link-card {
    display: flex;
    align-items: center; /* 세로 중앙 정렬 */
    gap: 15px;
    padding: 15px 20px;
    border: 1px solid #ddd;
    border-radius: 15px; /* 모서리를 둥글게 */
    background-color: #f8f9fa; /* 배경색 */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05); /* 은은한 그림자 효과 */
    transition: transform 0.2s, box-shadow 0.2s; /* 부드러운 전환 효과 */
    text-decoration: none;
    color: #333;
    font-weight: 600;
}
/* 링크 카드에 마우스를 올렸을 때 효과 */
.sns-link-card:hover {
    transform: translateY(-5px); /* 살짝 위로 이동 */
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1); /* 그림자 진하게 */
}

/* 링크 아이콘 스타일 */
.sns-link-card .link-icon {
    width: 24px;
    height: 24px;
    border-radius: 5px; /* 아이콘 모서리도 둥글게 */
    object-fit: contain; /* 이미지 비율 유지 */
}

/* 링크 텍스트 스타일 */
.sns-link-card .link-title {
    flex-grow: 1; /* 남은 공간을 모두 차지 */
    text-align: left; /* 텍스트를 왼쪽으로 정렬 */
}

  /* 구글 번역 상단 바(툴바) 숨기기 */
  .goog-te-banner-frame.skiptranslate { 
    display: none !important; 
  } 
  .goog-te-banner { 
    display: none !important; 
  } 
  body { 
    top: 0px !important; 
  } 
  
  /* 위젯 자체도 숨김 */
  #google_translate_element { 
    display: none !important; 
  }
  /* 구글 번역기 숨시시 css 끝 */