/* Basic styling for the search container */
.ifredex-domain-search {
    max-width: 600px;
    margin: 30px auto; /* Increased top/bottom margin */
    padding: 25px; /* Increased padding */
    background: #f9f9f9; /* Lighter background */
    border-radius: 8px; /* Slightly less rounded */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08); /* Softer shadow */
    border: 1px solid #e0e0e0; /* Subtle border */
    font-family: sans-serif; /* Basic font */
}

/* Input and Button flex layout */
.ifredex-domain-search {
    display: flex; /* Use flexbox for alignment */
    flex-wrap: wrap; /* Allow wrapping on smaller screens */
    gap: 10px; /* Space between input and button */
}

/* Style for the input field */
.ifredex-domain-search input[type="text"] {
    flex-grow: 1; /* Allow input to take available space */
    padding: 12px 15px; /* Comfortable padding */
    font-size: 16px;
    border: 1px solid #ccc;
    border-radius: 6px;
    box-sizing: border-box; /* Include padding and border in width */
    min-width: 200px; /* Minimum width before wrapping */
}

/* Style for the search button */
.ifredex-domain-search button {
    padding: 12px 20px; /* Comfortable padding */
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
    background-color: #0056b3; /* A standard blue */
    color: #ffffff;
    border: none;
    border-radius: 6px;
    transition: background-color 0.2s ease, opacity 0.2s ease; /* Smooth transition */
    white-space: nowrap; /* Prevent button text wrapping */
}

/* Button hover effect */
.ifredex-domain-search button:hover:not(:disabled) {
    background-color: #004494; /* Darker blue on hover */
}

/* Button disabled state */
.ifredex-domain-search button:disabled {
    background-color: #a0a0a0; /* Greyed out when disabled */
    cursor: not-allowed;
    opacity: 0.7;
}

/* Style for the results area */
#ifredex-domain-results {
    margin-top: 25px; /* More space above results */
    padding-top: 20px; /* Padding inside the results area */
    border-top: 1px solid #eee; /* Separator line */
    width: 100%; /* Ensure results take full width */
    font-size: 15px; /* Slightly smaller font for results */
    line-height: 1.6; /* Better readability */
}

/* Style for individual result paragraphs */
#ifredex-domain-results p {
    margin: 8px 0; /* Spacing between results */
    padding: 10px; /* Padding inside each result */
    border-radius: 4px;
    background-color: #fff; /* White background for each result */
    border: 1px solid #e8e8e8;
    display: flex; /* Use flex for alignment within the paragraph */
    justify-content: space-between; /* Space out elements */
    align-items: center;
    flex-wrap: wrap; /* Allow wrapping inside the paragraph */
    gap: 10px; /* Gap between domain name, status, and button */
}

/* Strong tag for domain name */
#ifredex-domain-results .domain-name {
    word-break: break-all; /* Prevent long domains from overflowing */
}


/* Status text styling */
.status-available {
    color: #28a745; /* Green */
    font-weight: bold;
}

.status-unavailable,
.status-taken {
    color: #dc3545; /* Red */
    font-weight: bold;
}

.status-error,
.status-unknown {
    color: #ffc107; /* Amber/Orange */
    font-weight: bold;
}

/* Styling for the 'Register Now' button */
.register-button {
    display: inline-block; /* Align properly */
    padding: 6px 12px;
    font-size: 14px;
    text-decoration: none;
    color: #fff;
    background-color: #28a745; /* Green */
    border-radius: 4px;
    transition: background-color 0.2s ease;
    margin-left: auto; /* Push button to the right */
    white-space: nowrap;
}

.register-button:hover {
    background-color: #218838; /* Darker green */
    color: #fff;
}

/* Loading/informative text */
#ifredex-domain-results em {
    color: #666;
    font-style: italic;
}

/* Responsive adjustments */
@media (max-width: 480px) {
    .ifredex-domain-search {
        padding: 15px;
    }

    .ifredex-domain-search input[type="text"],
    .ifredex-domain-search button {
        width: 100%; /* Stack input and button vertically */
        margin-bottom: 10px; /* Add space between stacked elements */
    }

     .ifredex-domain-search button {
         margin-bottom: 0; /* No bottom margin for the last element */
     }

    #ifredex-domain-results p {
        flex-direction: column; /* Stack elements vertically inside result */
        align-items: flex-start; /* Align items to the start */
    }

     .register-button {
         margin-left: 0; /* Remove left margin */
         margin-top: 8px; /* Add space above button */
         width: 100%; /* Make button full width */
         text-align: center; /* Center text */
     }
}