.cc-container {

max-width: 500px;
margin: 40px auto;
padding: 25px;

background: #ffffff;
border: 2px solid #000;

font-family: Arial;
text-align: center;

}

.cc-logo {

font-size: 20px;
font-weight: bold;
margin-bottom: 10px;

}

.cc-logo i {

margin-right: 8px;

}

.cc-result {

font-size: 32px;
margin-bottom: 20px;

}

.cc-box {

display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;

}

.cc-side {

flex: 1;

}

.cc-side input,
.cc-side select {

width: 100%;
padding: 10px;
margin-bottom: 10px;

border: 1px solid #000;
font-size: 16px;

}

.cc-switch {

background: #000;
color: #fff;

border: none;
padding: 12px;

cursor: pointer;

}

.cc-switch:hover {

opacity: 0.8;

}