/*
 * WP Family Tree - Memorial Manager Page Styles
 */
.wpft-memorial-manager-container { margin-bottom: 20px; }
.wpft-create-memorial-tabs { margin-bottom: 15px; border-bottom: 1px solid #ccc; padding-bottom: 5px; }
.wpft-tab-button { background: #f0f0f0; border: 1px solid #ccc; padding: 8px 15px; cursor: pointer; margin-right: 5px; border-bottom: none; border-top-left-radius: 4px; border-top-right-radius: 4px; }
.wpft-tab-button.active { background: #fff; border-bottom: 1px solid #fff; position: relative; top: 1px; font-weight: bold; }
.wpft-create-memorial-form { padding: 20px; border: 1px solid #e0e0e0; border-radius: 4px; margin-bottom: 30px; background-color: #f9f9f9; }
.wpft-create-memorial-form h3 { margin-top: 0; margin-bottom: 15px; }
.wpft-create-memorial-form .wpft-form-group { /* Inherits from style-core.css */ }
.wpft-create-memorial-form .wpft-select2-memorial { /* Inherits from style-trees.css for consistency */ }
.wpft-create-memorial-form .select2-container--default .select2-selection--single { /* Inherits from style-trees.css for consistency */ }
.wpft-create-memorial-form .select2-container--default .select2-selection--single .select2-selection__rendered { /* Inherits */ }
.wpft-create-memorial-form .select2-container--default .select2-selection--single .select2-selection__arrow { /* Inherits */ }
.wpft-create-memorial-form .select2-container { width: 100% !important; flex-grow: 0; } /* Ensure full width */

#wpft_create_memorial_button { /* If this is an ID for the submit button */
    width: 100%;
    height: 36px; line-height: 34px; padding: 0 15px !important;
    box-sizing: border-box;
}

.wpft-my-memorials-list h3 { margin-bottom: 15px; }
.wpft-my-memorials-list ul { list-style: none; padding: 0; margin: 0; }
/* Old list style, can be removed if grid is preferred */
/*
.wpft-my-memorials-list ul li {
    padding: 10px 15px;
    border: 1px solid #eee;
    margin-bottom: 10px;
    border-radius: 3px;
    background-color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.wpft-my-memorials-list ul li a { text-decoration: none; color: #0073aa; font-weight: bold; }
.wpft-my-memorials-list ul li a:hover { text-decoration: underline; }
.wpft-my-memorials-list ul li span { font-size: 0.9em; color: #777; margin-left: 10px; }
*/
.wpft-delete-memorial-button {
    background-color: #f8d7da; color: #721c24; border-color: #f5c6cb;
    padding: 3px 8px; font-size: 0.85em;
}
.wpft-delete-memorial-button:hover { background-color: #f1b0b7; border-color: #eba3aa; }

.wpft-memorial-items-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
    list-style: none;
    padding: 0;
    margin: 0;
}
.wpft-memorial-item-card {
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    background-color: #fff;
    box-shadow: 0 2px 5px rgba(0,0,0,0.08);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: box-shadow 0.2s ease-in-out;
}
.wpft-memorial-item-card:hover {
    box-shadow: 0 4px 10px rgba(0,0,0,0.12);
}
.wpft-memorial-item-card--focused { /* If you implement focus on this page */
    box-shadow: 0 0 0 3px #0073aa !important;
}
a.wpft-memorial-card-link {
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}
.wpft-memorial-card-image {
    width: 100%;
    padding-top: 60%; /* Aspect ratio for image area */
    position: relative;
    background-color: #f0f0f0; /* Fallback bg */
    display: flex; /* For centering multiple images */
    justify-content: center;
    align-items: center;
}
.wpft-memorial-card-image img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 80%; /* Max width for single avatar */
    max-height: 80%; /* Max height for single avatar */
    width: auto;
    height: auto;
    object-fit: cover;
    border-radius: 50%;
    border: 2px solid #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}
/* Styles for two avatars */
.wpft-memorial-card-image img.wpft-memorial-card-image-person2 { /* Second avatar in a pair */
    left: 65%; /* Position to the right */
    transform: translate(-35%, -50%); /* Adjust for its own width */
    max-width: 45%; /* Smaller size for dual display */
    max-height: 45%;
}
.wpft-memorial-card-image img:first-child:not(.wpft-memorial-card-image-person2) {
    /* Default styling for single avatar, already covered by general img rule */
}
.wpft-memorial-card-image img:first-child.wpft-memorial-card-image-person2 ~ img { /* First avatar in a pair when second is present */
    left: 35%; /* Position to the left */
    transform: translate(-65%, -50%); /* Adjust for its own width */
    max-width: 45%; /* Smaller size for dual display */
    max-height: 45%;
}
.wpft-memorial-card-name {
    padding: 10px 15px;
    font-size: 1.1em;
    font-weight: bold;
    color: #333;
    text-align: center;
    border-bottom: 1px solid #f0f0f0;
    flex-grow: 1; /* Allow name to take up space */
}
.wpft-memorial-card-date {
    padding: 8px 15px;
    font-size: 0.85em;
    color: #777;
    text-align: center;
    background-color: #f9f9f9;
}
.wpft-memorial-card-actions {
    padding: 10px 15px;
    text-align: right;
    background-color: #f9f9f9;
    border-top: 1px solid #f0f0f0;
}