/* Seed Box Block Styles */
.soaf-seed-box {
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    transition: all 0.3s ease;
    border: 0 solid transparent; /* Default border setup */
    position: relative;
    margin-top: 50px; /* Add space for the icon */
    overflow: visible; /* Ensure icon is not clipped */
}

.soaf-seed-box:hover {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    transform: translateY(-2px);
}

/* Border styling - these will be overridden by inline styles */
.soaf-seed-box[style*="border-width"] {
    border-style: solid; /* Fallback if not specified */
}

.soaf-seed-box__title {
    font-size: 1.25rem;
    font-weight: 600;
    margin: 0 0 1rem 0;
    line-height: 1.4;
}

.soaf-seed-box__content {
    font-size: 1rem;
    line-height: 1.6;
    margin: 0;
}

.soaf-seed-box__content p {
    margin: 0 0 1rem 0;
}

.soaf-seed-box__content p:last-child {
    margin-bottom: 0;
}

/* Text alignment utilities */
.soaf-seed-box.text-center {
    text-align: center;
}

.soaf-seed-box.text-right {
    text-align: right;
}

.soaf-seed-box.text-left {
    text-align: left;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .soaf-seed-box {
        padding: 1rem;
    }
    
    .soaf-seed-box__title {
        font-size: 1.125rem;
    }
}

/* Border utility classes for different widths */
.soaf-seed-box.border-0 { border-width: 0; }
.soaf-seed-box.border-1 { border-width: 1px; }
.soaf-seed-box.border-2 { border-width: 2px; }
.soaf-seed-box.border-3 { border-width: 3px; }
.soaf-seed-box.border-4 { border-width: 4px; }
.soaf-seed-box.border-5 { border-width: 5px; }

/* Border style utilities */
.soaf-seed-box.border-solid { border-style: solid; }
.soaf-seed-box.border-dashed { border-style: dashed; }
.soaf-seed-box.border-dotted { border-style: dotted; }

/* Icon container - dynamic sizing handled by inline styles */
.soaf-seed-box .soaf-seed-box__icon {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: 100;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    box-sizing: border-box;
    overflow: visible;
}

/* Ensure the block has proper spacing when icon is present */
.soaf-seed-box:has(.soaf-seed-box__icon) {
    margin-top: 50px;
}

/* Ensure parent containers don't clip the icon */
.wp-block-soaf-seed-box {
    overflow: visible !important;
}

/* Editor specific styles to prevent clipping */
.block-editor-block-list__block[data-type="soaf/seed-box"] {
    overflow: visible !important;
}