/*
 * Eski tasarımın global stilleri.
 * Sadece henüz yeni tasarıma geçmemiş sayfalarda (body.legacy) ve sadece sayfa içeriğinde (main) geçerli.
 * Bir sayfa yeni tasarıma geçince @section('body_class', '') ile bu stillerden çıkar.
 */
body.legacy main,
body.legacy main * {
    font-family: 'Onest', Arial, Helvetica, sans-serif;
}

body.legacy main .card:not(.border-0),
body.legacy main .card-body,
body.legacy main .border.rounded:not(.rounded-circle),
body.legacy main .alert {
    border: 4px solid #f8f9fa !important;
    border-radius: 24px !important;
}

body.legacy main .card-body {
    padding: 16px 8px !important;
}

body.legacy main input[type="text"],
body.legacy main input[type="email"],
body.legacy main input[type="password"],
body.legacy main input[type="number"],
body.legacy main input[type="tel"],
body.legacy main input[type="date"],
body.legacy main input[type="time"],
body.legacy main input[type="search"],
body.legacy main textarea,
body.legacy main select,
body.legacy main .form-control,
body.legacy main .form-select {
    font-size: 16px !important;
    padding: 14px 18px !important;
    height: auto !important;
    min-height: 52px !important;
    border: 2px solid #e0e0e0 !important;
    border-radius: 12px !important;
    background-color: #ffffff !important;
    color: #333333 !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
    line-height: 1.5 !important;
}

body.legacy main input[type="text"]:focus,
body.legacy main input[type="email"]:focus,
body.legacy main input[type="password"]:focus,
body.legacy main input[type="number"]:focus,
body.legacy main input[type="tel"]:focus,
body.legacy main input[type="date"]:focus,
body.legacy main input[type="time"]:focus,
body.legacy main input[type="search"]:focus,
body.legacy main textarea:focus,
body.legacy main select:focus,
body.legacy main .form-control:focus,
body.legacy main .form-select:focus {
    border-color: #0d6efd !important;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.15) !important;
    outline: none !important;
    background-color: #ffffff !important;
}

body.legacy main select,
body.legacy main .form-select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 18px center !important;
    background-size: 16px 12px !important;
    padding-right: 45px !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    cursor: pointer !important;
    text-transform: uppercase !important;
}

body.legacy main select option,
body.legacy main .form-select option {
    text-transform: uppercase !important;
    font-weight: 500 !important;
    padding: 12px 18px !important;
    font-size: 15px !important;
    background-color: #ffffff !important;
}

body.legacy main select option:hover,
body.legacy main .form-select option:hover {
    background-color: #0d6efd !important;
    color: #ffffff !important;
}

body.legacy main select:hover,
body.legacy main .form-select:hover {
    border-color: #0d6efd !important;
}

body.legacy main textarea {
    min-height: 120px !important;
    resize: vertical !important;
}

body.legacy main input::placeholder,
body.legacy main textarea::placeholder {
    color: #999999 !important;
    font-weight: 400 !important;
    opacity: 1 !important;
}

body.legacy main label,
body.legacy main .form-label {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #333333 !important;
    margin-bottom: 8px !important;
}

body.legacy main .form-group,
body.legacy main .mb-3 {
    margin-bottom: 1.25rem !important;
}

body.legacy main input.form-control-sm,
body.legacy main select.form-select-sm {
    font-size: 14px !important;
    padding: 10px 14px !important;
    min-height: 44px !important;
}

body.legacy main input.form-control-lg,
body.legacy main select.form-select-lg {
    font-size: 18px !important;
    padding: 18px 22px !important;
    min-height: 60px !important;
}
