:root{
    --color-bg-f9fafb: #F9FAFB;
    --color-bg-ffffff: #FFFFFF;
    --color-17151f: #17151F;
    --color-5c5870: #5C5870;
    --color-8a8598: #8A8598;
    --color-92929d: #92929D;
    --color-bg-primary-send:#6A65FF;
    --color-labels: #92929D;
    --color-gradient-6c3cf0: #6C3CF0;
    --color-gradient-4b1fc9: #4B1FC9;
    --color-shadow-0000000d: #0000000D;
}
[data-theme="dark"] {
    --color-labels: white;
}

body {
    background-color: var(--color-bg-f6f3fb) !important;
}

.contact-info p {
    color: var(--color-text-body);
}

.contact-detail .label {
    color: var(--color-labels);
}

.contact-form-card {
    border-radius: 40px;
    box-shadow: 0 1px 2px 0 var(--color-shadow-0000000d);
    border: 1px solid var(--color-border-F3F4F6);
    background-color: var( --color-bg-white);
}

.contact-form-card .form-control {
    background-color: var( --color-bg-white);
    border-color: var(--color-border-e6e8ed);
    border-radius: 16px;
    color: var(--color-text-black);
}

.contact-form-card .form-control:focus {
    border-color: var(--color-border-e6e8ed);
    box-shadow: none;
}

.contact-form-card .form-control::placeholder {
    color: var(--color-92929d);
}

.value{
    color: var(--color-text-body);
}

.send-btn {
    background-color: var(--color-bg-primary);
    border: none;
    padding-right: 6px;
    height: 60px;
    width: 207px;
}

.send-btn:hover {
    background-color: var(--color-bg-primary-send);
}

.send-btn .icon-circle {
    width: 28px;
    height: 28px;
    background: var(--color-bg-ffffff);
}

.resize-none {
    resize: none;
}

@media (max-width: 767px) {
    .contact-form-card {
        border-radius: 26px;
    }
}