/* Niilo Koke Profiili - lomake */

.niilo-koke-lomake-wrap {
    max-width: 680px;
    margin: 0 auto;
}

.niilo-koke-viesti {
    padding: 12px 16px;
    border-radius: 6px;
    margin-bottom: 20px;
    font-weight: 500;
}

.niilo-koke-viesti.success {
    background: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
}

.niilo-koke-viesti.error {
    background: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
}

.niilo-koke-otsikko {
    font-size: 1.05rem;
    font-weight: 600;
    margin: 28px 0 12px;
    padding-bottom: 6px;
    border-bottom: 2px solid var(--wp--preset--color--primary, #7c3aed);
    color: var(--wp--preset--color--primary, #7c3aed);
}

.niilo-koke-kentta {
    margin-bottom: 16px;
}

.niilo-koke-kentta label {
    display: block;
    font-weight: 500;
    margin-bottom: 6px;
    font-size: 0.9rem;
}

.niilo-koke-kentta input[type="text"],
.niilo-koke-kentta input[type="email"],
.niilo-koke-kentta input[type="number"] {
    width: 100%;
    padding: 9px 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 0.95rem;
    box-sizing: border-box;
    transition: border-color 0.2s;
}

.niilo-koke-kentta input:focus {
    outline: none;
    border-color: var(--wp--preset--color--primary, #7c3aed);
    box-shadow: 0 0 0 2px rgba(124, 58, 237, 0.1);
}

/* Rinnakkaiset kentät */
.niilo-koke-rivi {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

@media (max-width: 480px) {
    .niilo-koke-rivi {
        grid-template-columns: 1fr;
    }
}

/* Toistuvat rivit */
.niilo-koke-toistuva {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-bottom: 8px;
}

.niilo-koke-toistuva input {
    flex: 1;
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 0.95rem;
}

.niilo-poista-rivi {
    background: none;
    border: 1px solid #ddd;
    border-radius: 50%;
    width: 28px;
    height: 28px;
    cursor: pointer;
    color: #999;
    font-size: 0.8rem;
    flex-shrink: 0;
    transition: all 0.2s;
    padding: 0;
}

.niilo-poista-rivi:hover {
    background: #fee2e2;
    border-color: #fca5a5;
    color: #dc2626;
}

.niilo-lisaa-nappi {
    background: none;
    border: 1px dashed #bbb;
    border-radius: 6px;
    padding: 7px 14px;
    cursor: pointer;
    color: #666;
    font-size: 0.875rem;
    margin-top: 4px;
    transition: all 0.2s;
}

.niilo-lisaa-nappi:hover {
    border-color: var(--wp--preset--color--primary, #7c3aed);
    color: var(--wp--preset--color--primary, #7c3aed);
    background: rgba(124, 58, 237, 0.04);
}

/* Checkboxit */
.niilo-koke-checkboxit {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.niilo-koke-checkbox {
    display: flex !important;
    align-items: center;
    gap: 6px;
    background: #f5f5f5;
    border: 1px solid #e0e0e0;
    border-radius: 20px;
    padding: 5px 12px;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: normal !important;
    transition: all 0.2s;
    user-select: none;
}

.niilo-koke-checkbox:hover {
    background: #ede9fe;
    border-color: var(--wp--preset--color--primary, #7c3aed);
}

.niilo-koke-checkbox input[type="checkbox"] {
    width: auto;
    margin: 0;
}

.niilo-koke-checkbox input:checked + span,
.niilo-koke-checkbox:has(input:checked) {
    background: var(--wp--preset--color--primary, #7c3aed);
    border-color: var(--wp--preset--color--primary, #7c3aed);
    color: white;
}

/* Julkaisustatus */
.niilo-koke-julkaisu {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.niilo-koke-radio {
    display: flex !important;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    cursor: pointer;
    font-weight: normal !important;
    transition: all 0.2s;
}

.niilo-koke-radio:hover {
    border-color: var(--wp--preset--color--primary, #7c3aed);
    background: rgba(124, 58, 237, 0.03);
}

.niilo-koke-radio input[type="radio"] {
    width: auto;
    margin-top: 2px;
    flex-shrink: 0;
}

.niilo-koke-radio:has(input:checked) {
    border-color: var(--wp--preset--color--primary, #7c3aed);
    background: rgba(124, 58, 237, 0.06);
}

.niilo-koke-huomio {
    font-size: 0.8rem;
    color: #6b7280;
    margin: 4px 0 0;
    font-style: italic;
}

/* Tallennusnappi */
.niilo-koke-toiminnot {
    margin-top: 32px;
    display: flex;
    align-items: center;
    gap: 16px;
}

.niilo-tallenna-nappi {
    background: var(--wp--preset--color--primary, #7c3aed);
    color: white;
    border: none;
    padding: 12px 28px;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.2s;
}

.niilo-tallenna-nappi:hover {
    opacity: 0.88;
}

.niilo-tallenna-nappi:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.niilo-spinner {
    color: #6b7280;
    font-size: 0.9rem;
}

.niilo-koke-virhe {
    color: #dc2626;
    padding: 12px;
    background: #fef2f2;
    border-radius: 6px;
}

/* Meta Box -ohjatun lomakkeen yleiset kentät */
.niilo-koke-kentta textarea,
.niilo-koke-kentta select,
.niilo-koke-kentta input[type="url"],
.niilo-koke-kentta input[type="tel"],
.niilo-koke-kentta input[type="date"],
.niilo-koke-kentta input[type="time"],
.niilo-koke-kentta input[type="datetime-local"] {
    width: 100%;
    padding: 9px 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 0.95rem;
    box-sizing: border-box;
}

.niilo-koke-kentta textarea:focus,
.niilo-koke-kentta select:focus {
    outline: none;
    border-color: var(--wp--preset--color--primary, #7c3aed);
    box-shadow: 0 0 0 2px rgba(124, 58, 237, 0.1);
}

.niilo-koke-kuvaus {
    margin: 6px 0 0;
    color: #6b7280;
    font-size: 0.84rem;
}

.niilo-koke-vaihtoehdot {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.niilo-koke-yksi-checkbox {
    width: fit-content;
}


/* Profiilikuvan valinta */
.niilo-koke-default-image-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(92px,1fr)); gap:10px; margin:10px 0 14px; }
.niilo-koke-image-option { font-weight:400 !important; }
.niilo-koke-default-image-grid .niilo-koke-image-option { position:relative; display:block; cursor:pointer; margin:0; }
.niilo-koke-default-image-grid input { position:absolute; opacity:0; pointer-events:none; }
.niilo-koke-profile-thumb { display:block; width:92px; height:92px; object-fit:cover; border-radius:12px; border:3px solid transparent; box-sizing:border-box; }
.niilo-koke-default-image-grid input:checked + .niilo-koke-profile-thumb { border-color:var(--wp--preset--color--primary,#7c3aed); }
.niilo-koke-image-auto, .niilo-koke-own-image-option { display:flex !important; align-items:center; gap:8px; margin:10px 0; }
.niilo-koke-current-own-image { display:flex; align-items:center; gap:10px; margin:8px 0; font-size:.85rem; color:#6b7280; }
.niilo-koke-current-own-image .niilo-koke-profile-thumb { width:72px; height:72px; }
#niilo_profile_image_upload { display:block; margin-top:8px; }

/* Niilon sisäinen yksittäinen kokemusasiantuntijaprofiili */
.niilo-koke-profile-view { max-width:860px; margin:0 auto; }
.niilo-koke-profile-header { display:flex; align-items:center; gap:26px; padding:8px 0 28px; border-bottom:1px solid #e5e7eb; }
.niilo-koke-profile-image-wrap { flex:0 0 auto; }
.niilo-koke-profile-image { display:block; width:180px; height:180px; object-fit:cover; border-radius:22px; }
.niilo-koke-profile-image-empty { display:flex; align-items:center; justify-content:center; background:#f3f4f6; color:#d1d5db; font-size:4rem; }
.niilo-koke-profile-name { margin:0; font-size:clamp(2rem,5vw,3rem); line-height:1.05; color:inherit; }
.niilo-koke-profile-own-label { display:inline-block; margin-top:10px; padding:5px 10px; border-radius:999px; background:#f3f4f6; color:#6b7280; font-size:.82rem; }
.niilo-koke-profile-body { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 36px; padding-top:12px; }
.niilo-koke-profile-field { padding:20px 0; border-bottom:1px solid #ececec; }
.niilo-koke-profile-field h2 { margin:0 0 8px; font-size:1rem; color:var(--wp--preset--color--primary,#7c3aed); }
.niilo-koke-profile-value { font-size:1rem; line-height:1.55; }
.niilo-koke-profile-value p:first-child { margin-top:0; }
.niilo-koke-profile-value p:last-child { margin-bottom:0; }
.niilo-koke-profile-list { margin:0; padding-left:1.2em; }
.niilo-koke-profile-tags { display:flex; flex-wrap:wrap; gap:7px; }
.niilo-koke-profile-tags span { display:inline-block; padding:5px 11px; border-radius:999px; background:#f3f4f6; font-size:.88rem; }
@media (max-width:680px) {
  .niilo-koke-profile-header { align-items:flex-start; gap:18px; }
  .niilo-koke-profile-image { width:116px; height:116px; border-radius:16px; }
  .niilo-koke-profile-body { grid-template-columns:1fr; }
}


/* Kokemusasiantuntijalista 1.4.0 */
.niilo-koke-profile-list-wrap {
    width: 100%;
}

.niilo-koke-list-filters {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
    align-items: end;
    margin: 0 0 24px;
    padding: 20px;
    border: 1px solid rgba(0,0,0,.10);
    border-radius: 14px;
    background: #fff;
}

.niilo-koke-list-filter label {
    display: block;
    margin-bottom: 6px;
    font-weight: 600;
}

.niilo-koke-list-filter input,
.niilo-koke-list-filter select {
    width: 100%;
    min-height: 44px;
}

.niilo-koke-list-filter-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
}

.niilo-koke-list-reset {
    text-decoration: underline;
}

.niilo-koke-profile-list-summary {
    margin: 0 0 16px;
    font-weight: 600;
}

.niilo-koke-profile-grid {
    display: grid;
    grid-template-columns: repeat(var(--niilo-koke-columns, 3), minmax(0, 1fr));
    gap: 22px;
}

.niilo-koke-profile-card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(0,0,0,.10);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 3px 14px rgba(0,0,0,.05);
}

.niilo-koke-profile-card-main {
    display: block;
    color: inherit;
    text-decoration: none;
}

.niilo-koke-profile-card-image-wrap {
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: rgba(0,0,0,.035);
}

.niilo-koke-profile-card-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.niilo-koke-profile-card-name {
    margin: 0;
    padding: 16px 18px 8px;
    font-size: 1.3rem;
    line-height: 1.2;
}

.niilo-koke-profile-card-details {
    flex: 1;
    padding: 6px 18px 12px;
}

.niilo-koke-card-taxonomy {
    margin-top: 10px;
}

.niilo-koke-card-taxonomy-label {
    display: block;
    margin-bottom: 5px;
    font-size: .82em;
    font-weight: 700;
    opacity: .72;
}

.niilo-koke-profile-card .niilo-koke-profile-tags {
    gap: 5px;
}

.niilo-koke-profile-card .niilo-koke-profile-tags span {
    font-size: .82em;
}

.niilo-koke-profile-card-link {
    display: block;
    margin: 0 18px 18px;
    padding: 10px 14px;
    border-radius: 9px;
    text-align: center;
    text-decoration: none;
    font-weight: 700;
    background: rgba(0,0,0,.055);
    color: inherit;
}

.niilo-koke-profile-card-link:hover,
.niilo-koke-profile-card-link:focus {
    background: rgba(0,0,0,.09);
}

.niilo-koke-profile-list-empty {
    padding: 24px;
    border-radius: 12px;
    background: rgba(0,0,0,.04);
}

.niilo-koke-pagination {
    margin-top: 28px;
}

.niilo-koke-pagination .page-numbers {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    padding: 0;
    list-style: none;
}

.niilo-koke-pagination a,
.niilo-koke-pagination span {
    display: inline-block;
    padding: 8px 11px;
    border-radius: 8px;
    text-decoration: none;
}

@media (max-width: 620px) {
    .niilo-koke-list-filters {
        grid-template-columns: 1fr;
    }

    .niilo-koke-profile-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .niilo-koke-profile-card-name {
        padding: 12px 12px 6px;
        font-size: 1.05rem;
    }

    .niilo-koke-profile-card-details {
        padding: 4px 12px 8px;
    }

    .niilo-koke-profile-card-link {
        margin: 0 12px 12px;
        padding: 9px 8px;
        font-size: .9em;
    }
}

@media (max-width: 390px) {
    .niilo-koke-profile-grid {
        grid-template-columns: 1fr;
    }
}

/* 1.4.1: listakortin lyhyt kuvaus */
.niilo-koke-profile-card-short { padding: 2px 18px 8px; line-height: 1.5; }
@media (max-width:620px) { .niilo-koke-profile-card-short { padding: 2px 12px 6px; font-size:.92em; } }


/* Niilo Kokeportti 1.1.0: oman profiilin muokkaus */
.niilo-koke-owner-editor {
    max-width: 860px;
    margin: 28px auto 0;
    border: 1px solid rgba(0,0,0,.12);
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
}
.niilo-koke-owner-editor > summary {
    cursor: pointer;
    padding: 17px 20px;
    font-weight: 700;
    font-size: 1.05rem;
}
.niilo-koke-owner-editor[open] > summary {
    border-bottom: 1px solid rgba(0,0,0,.09);
}
.niilo-koke-owner-editor-content {
    padding: 4px 20px 24px;
}

/* Niilo Kokeportti 1.1.0: yhteydenotto */
.niilo-koke-contact {
    max-width: 860px;
    margin: 30px auto 0;
    padding-top: 24px;
    border-top: 1px solid #e5e7eb;
}
.niilo-koke-contact > h2 {
    margin: 0 0 8px;
}
.niilo-koke-contact-details {
    margin-top: 16px;
    border: 1px solid rgba(0,0,0,.12);
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
}
.niilo-koke-contact-details > summary {
    cursor: pointer;
    padding: 15px 18px;
    font-weight: 700;
}
.niilo-koke-contact-details[open] > summary {
    border-bottom: 1px solid rgba(0,0,0,.09);
}
.niilo-koke-contact-form {
    padding: 18px;
}
.niilo-koke-contact-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 14px;
}
.niilo-koke-contact-field {
    margin-bottom: 14px;
}
.niilo-koke-contact-field label {
    display: block;
    margin-bottom: 6px;
    font-weight: 600;
}
.niilo-koke-contact-field input,
.niilo-koke-contact-field textarea {
    width: 100%;
    box-sizing: border-box;
}
.niilo-koke-contact-notice {
    margin: 14px 0;
    padding: 12px 14px;
    border-radius: 8px;
}
.niilo-koke-contact-notice.success {
    background: #d4edda;
    color: #155724;
}
.niilo-koke-contact-notice.error {
    background: #f8d7da;
    color: #721c24;
}

@media (max-width: 900px) {
    .niilo-koke-profile-grid {
        grid-template-columns: repeat(min(2, var(--niilo-koke-columns, 3)), minmax(0, 1fr));
    }
}
@media (max-width: 620px) {
    .niilo-koke-contact-grid {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 390px) {
    .niilo-koke-profile-grid {
        grid-template-columns: 1fr;
    }
}


/* Niilo Kokeportti 1.2.0 */
.niilo-koke-existing-state { max-width:640px; padding:18px 20px; border:1px solid rgba(0,0,0,.10); border-radius:12px; background:#fff; }
.niilo-koke-existing-state p:first-child { margin-top:0; }
.niilo-koke-existing-state p:last-child { margin-bottom:0; }
.niilo-koke-state-button { display:inline-block; border:0; border-radius:8px; padding:11px 18px; cursor:pointer; text-decoration:none; font-weight:700; background:var(--wp--preset--color--primary,#7c3aed); color:#fff; }


/* Niilo Kokeportti 1.2.3: profiilinäkymän viimeistely */
.niilo-koke-profile-name {
    font-size: clamp(1.7rem, 4vw, 2.45rem);
}
.niilo-koke-profile-short {
    margin-top: 10px;
    max-width: 620px;
    font-size: 1.02rem;
    line-height: 1.55;
    color: #4b5563;
}
.niilo-koke-profile-story {
    margin-top: 30px;
    padding-top: 24px;
    border-top: 1px solid #e5e7eb;
}
.niilo-koke-profile-story h2 {
    margin: 0 0 12px;
    color: var(--wp--preset--color--primary,#7c3aed);
    font-size: 1.25rem;
}
.niilo-koke-profile-story-content {
    font-size: 1.02rem;
    line-height: 1.7;
}
.niilo-koke-profile-story-content > :first-child { margin-top: 0; }
.niilo-koke-profile-story-content > :last-child { margin-bottom: 0; }