/* CKY_SERVICE_PROFILE_V1 */
.cky-modern-search-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
    gap: 10px;
    width: 100%;
    align-items: start;
}
.cky-native-select {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}
.cky-combobox, .cky-multiselect { position: relative; min-width: 0; }
.cky-combobox-control, .cky-multiselect-control {
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: 44px;
    padding: 5px 8px;
    border: 1px solid #cbd5e0;
    border-radius: 8px;
    background: #fff;
    box-sizing: border-box;
    transition: border-color .15s, box-shadow .15s;
}
.cky-combobox.is-open .cky-combobox-control,
.cky-multiselect.is-open .cky-multiselect-control,
.cky-combobox-control:focus-within,
.cky-multiselect-control:focus-within {
    border-color: #3182ce;
    box-shadow: 0 0 0 3px rgba(49,130,206,.14);
}
.cky-combobox-input, .cky-multiselect-input {
    flex: 1;
    min-width: 80px;
    border: 0 !important;
    outline: none;
    box-shadow: none !important;
    padding: 7px 4px !important;
    margin: 0 !important;
    background: transparent;
    font-size: .95rem;
}
.cky-combobox-clear, .cky-combobox-toggle {
    border: 0;
    background: transparent;
    color: #718096;
    padding: 5px;
    min-width: 28px;
    cursor: pointer;
    border-radius: 5px;
}
.cky-combobox-clear:hover, .cky-combobox-toggle:hover { background: #edf2f7; }
.cky-options {
    display: none;
    position: absolute;
    z-index: 2200;
    left: 0;
    right: 0;
    top: calc(100% + 5px);
    max-height: 290px;
    overflow-y: auto;
    padding: 6px;
    background: #fff;
    border: 1px solid #cbd5e0;
    border-radius: 9px;
    box-shadow: 0 12px 28px rgba(0,0,0,.16);
}
.cky-combobox.is-open .cky-options, .cky-multiselect.is-open .cky-options { display: block; }
.cky-option {
    display: block;
    width: 100%;
    border: 0;
    background: transparent;
    text-align: left;
    padding: 9px 10px;
    border-radius: 7px;
    cursor: pointer;
    color: #2d3748;
    line-height: 1.35;
}
.cky-option:hover, .cky-option.is-active { background: #ebf8ff; color: #2b6cb0; }
.cky-option.is-selected { background: #e6fffa; color: #276749; font-weight: 700; }
.cky-option-group { display:block; color:#718096; font-size:.75rem; margin-top:3px; font-weight:400; }
.cky-empty-option { padding: 16px 10px; text-align: center; color: #a0aec0; font-size: .9rem; }
.cky-selected-tags, .cky-current-service-tags, .cky-locked-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.cky-current-service-tags { margin-bottom: 15px; }
.cky-tag, .cky-profile-tag {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: #ebf8ff;
    color: #2b6cb0;
    border-radius: 999px;
    padding: 5px 9px;
    font-size: .78rem;
    line-height: 1.25;
}
.cky-tag button { border:0; background:transparent; color:inherit; padding:0; cursor:pointer; font-size:1rem; line-height:1; }
.cky-profile-tag.is-locked, .cky-locked-services { background: #fffaf0; color: #975a16; }
.cky-locked-services { border: 1px solid #f6ad55; border-radius: 8px; padding: 10px; margin-bottom: 10px; }
.cky-locked-services strong, .cky-locked-services small { display:block; margin-bottom:7px; }
.cky-selection-meta { display:flex; justify-content:space-between; color:#718096; font-size:.78rem; padding:3px 2px 0; }
.cky-service-profile-form { background:#f8fafc; padding:20px; border-radius:8px; border:1px solid #e2e8f0; }
.cky-service-profile-form h3 { margin:0 0 16px; color:#2d3748; }
.cky-field-label { font-weight:bold; color:#4a5568; margin-top:15px; display:block; }
.cky-field-help { display:block; color:#718096; margin:5px 0 12px; line-height:1.4; }
.qualification-review-note { grid-column:1/-1; padding:10px; border:1px solid #f6ad55; background:#fffaf0; color:#975a16; border-radius:8px; font-size:.84rem; line-height:1.45; }
.cky-field-error { color:#c53030; font-size:.82rem; margin-top:4px; }
@media (max-width: 700px) {
    .cky-modern-search-form { grid-template-columns: 1fr; }
    .cky-modern-search-form button[type="submit"] { width:100%; }
    .cky-options { max-height: 45vh; }
}

/* CKY_FRIENDLY_VALIDATION_V1 */
.cky-page-feedback,
.cky-flash-message,
.cky-form-feedback-message {
    box-sizing: border-box;
    width: 100%;
    border-radius: 8px;
    padding: 11px 13px;
    margin: 0 0 14px;
    font-size: .9rem;
    line-height: 1.45;
}
.cky-page-feedback.error,
.cky-flash-message.error,
.cky-form-feedback-message.error {
    background: #fff5f5;
    border: 1px solid #fc8181;
    color: #9b2c2c;
}
.cky-page-feedback.success,
.cky-flash-message.success,
.cky-form-feedback-message.success {
    background: #f0fff4;
    border: 1px solid #68d391;
    color: #276749;
}
.cky-inline-validation[hidden],
.cky-form-feedback-message[hidden] { display: none !important; }
.cky-has-error > .cky-combobox-control,
.cky-has-error > .cky-multiselect-control,
.cky-has-error.cky-checkbox-limit-group,
.cky-has-error > input,
.cky-has-error > select,
.cky-has-error > textarea {
    border-color: #e53e3e !important;
    box-shadow: 0 0 0 3px rgba(229, 62, 62, .12) !important;
}
.cky-field-feedback-anchor {
    margin: -6px 0 10px;
}
.cky-field-feedback-anchor .cky-form-feedback-message {
    margin: 0;
}
.cky-checkbox-limit-group {
    transition: border-color .15s, box-shadow .15s;
}
.cky-checkbox-selection-meta {
    margin-top: 8px;
    color: #718096;
    font-size: .8rem;
    text-align: left;
}
.cky-checkbox-selection-meta.is-at-limit,
.cky-selection-meta.is-at-limit {
    color: #c53030;
    font-weight: 700;
}
.cky-field-error.cky-inline-validation {
    margin: 7px 0 0;
    padding: 8px 10px;
    border-radius: 7px;
    background: #fff5f5;
    border: 1px solid #feb2b2;
    color: #c53030;
    font-weight: 600;
    line-height: 1.4;
}

/* CKY_MOBILE_RESPONSIVE_V1
   Fixes mobile text clipping caused by the global input width:100% rule
   conflicting with the custom flex-based combobox controls. */
.cky-combobox,
.cky-multiselect,
.cky-combobox-control,
.cky-multiselect-control,
.cky-selected-tags,
.cky-current-service-tags,
.cky-locked-tags {
    min-width: 0;
    max-width: 100%;
}

.cky-combobox-control,
.cky-multiselect-control {
    width: 100%;
    overflow: hidden;
}

.cky-combobox-input,
.cky-multiselect-input {
    flex: 1 1 0%;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 100%;
    box-sizing: border-box;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    -webkit-appearance: none;
    appearance: none;
}

.cky-combobox-input::-webkit-search-cancel-button,
.cky-multiselect-input::-webkit-search-cancel-button,
.cky-combobox-input::-webkit-search-decoration,
.cky-multiselect-input::-webkit-search-decoration {
    -webkit-appearance: none;
    appearance: none;
    display: none;
}

.cky-combobox-clear,
.cky-combobox-toggle {
    flex: 0 0 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    min-width: 34px;
    padding: 0;
}

.cky-options {
    max-width: 100%;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}

.cky-option,
.cky-option > span,
.cky-option-group,
.cky-tag,
.cky-profile-tag {
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.cky-option > span,
.cky-option-group {
    display: block;
    width: 100%;
}

body .dashboard,
.client-header,
.search-bar,
.list-container,
.list-item,
.item-main,
.info-box,
.action-box,
.profile-card,
.info-section {
    min-width: 0;
    max-width: 100%;
}

@media (max-width: 700px) {
    .cky-combobox-input,
    .cky-multiselect-input {
        font-size: 16px;
    }

    .cky-combobox-control,
    .cky-multiselect-control {
        min-height: 48px;
        padding: 5px 6px;
    }

    .cky-options {
        left: 0;
        right: 0;
        width: auto;
        max-height: min(52vh, 360px);
    }

    .cky-option {
        padding: 12px 10px;
        font-size: .95rem;
        line-height: 1.45;
    }

    body .dashboard {
        width: 100%;
        margin: 10px auto !important;
        padding: 10px !important;
    }

    .client-header,
    .list-item {
        padding: 14px !important;
    }

    .item-main {
        gap: 12px !important;
    }

    .info-box,
    .action-box,
    .info-section {
        min-width: 0 !important;
        width: 100% !important;
    }

    .info-box h3,
    .tag,
    .area-tag,
    .client-details,
    .client-details h2,
    .review-card,
    .review-card p {
        max-width: 100%;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .reviews-dropdown-btn {
        min-width: 0;
        gap: 8px;
        text-align: left;
    }

    .reviews-dropdown-btn > span:first-child {
        min-width: 0;
        white-space: normal;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .review-card > div {
        flex-wrap: wrap;
        gap: 8px;
    }
}