/* style.css - Custom Styles for Online Business Ideas Website */

/* Base styles for the Inter font and general body styling */
body {
    font-family: 'Inter', sans-serif;
    background-color: #f9fafb; /* bg-gray-50 */
    color: #374151; /* text-gray-800 */
}

/* Basic styling for links to ensure good readability */
a {
    color: #2563eb; /* text-blue-600 */
    transition-property: color;
    transition-duration: 200ms; /* transition-colors duration-200 */
}
a:hover {
    color: #1d4ed8; /* hover:text-blue-800 */
}

/* Styling for headings */
h1, h2, h3, h4, h5, h6 {
    font-weight: 600; /* font-semibold */
    color: #111827; /* text-gray-900 */
    margin-bottom: 1rem; /* mb-4 */
}

/* Styling for paragraphs */
p {
    margin-bottom: 1rem; /* mb-4 */
    line-height: 1.625; /* leading-relaxed */
}

/* Styling for buttons */
.btn-primary {
    display: inline-block; /* inline-block */
    background-color: #2563eb; /* bg-blue-600 */
    color: #ffffff; /* text-white */
    padding: 0.75rem 1.5rem; /* px-6 py-3 */
    border-radius: 0.5rem; /* rounded-lg */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); /* shadow-md */
    transition-property: background-color;
    transition-duration: 200ms; /* transition-colors duration-200 */
    text-align: center; /* Ensure text is centered */
    cursor: pointer; /* Indicate it's clickable */
    border: none; /* Remove default button border */
}
.btn-primary:hover {
    background-color: #1d4ed8; /* hover:bg-blue-700 */
}

/* Styling for card-like elements */
.card {
    background-color: #ffffff; /* bg-white */
    padding: 1.5rem; /* p-6 */
    border-radius: 0.5rem; /* rounded-lg */
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); /* shadow-sm */
    border: 1px solid #e5e7eb; /* border border-gray-200 */
}

/* Responsive image styling */
img {
    max-width: 100%; /* max-w-full */
    height: auto; /* h-auto */
    border-radius: 0.5rem; /* rounded-lg */
}

/* Fix for dropdown menu hover - ensure the dropdown appears immediately */
.group .group-hover\:block {
    margin-top: 0; /* Remove any gap */
    top: 100%; /* Position right below the parent */
}
/* Ensure dropdown is wide enough and doesn't get cut off */
.group ul {
    min-width: max-content; /* Ensure content fits */
}

/* Specific styles for the random tip banner */
.bg-yellow-50 { background-color: #fffbeb; }
.border-yellow-200 { border-color: #fde68a; }
.text-yellow-800 { color: #92400e; }

/* Specific styles for the newsletter signup card */
.bg-blue-50 { background-color: #eff6ff; }
.border-blue-200 { border-color: #bfdbfe; }
.text-blue-800 { color: #1e40af; }

/* Specific styles for the banner ad placeholder */
.bg-gray-200 { background-color: #e5e7eb; }
.text-gray-600 { color: #4b5563; }

/* Specific styles for advertisement packages */
.bg-green-50 { background-color: #ecfdf5; }
.border-green-200 { border-color: #a7f3d0; }
.text-green-800 { color: #065f46; }
.bg-red-500 { background-color: #ef4444; }
.bg-orange-600 { background-color: #ea580c; }
.bg-yellow-500 { background-color: #f59e0b; }
.bg-teal-600 { background-color: #0d9488; }
.bg-indigo-600 { background-color: #4f46e5; }
.bg-pink-600 { background-color: #db2777; }
.bg-blue-600 { background-color: #2563eb; }
.bg-purple-600 { background-color: #9333ea; }
.bg-gray-700 { background-color: #374151; }
.bg-blue-700 { background-color: #1d4ed8; }
