/* Custom styles for single post layout */

/* Shadow utility class */
.shadow-detail-collection {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

/* Primary color shadows */
.shadow-primary\/20 {
    --tw-shadow-color: rgba(var(--primary-rgb), 0.2);
    --tw-shadow: var(--tw-shadow-colored);
}

/* Font family for titles */
.font-pacifico {
    font-family: 'Pacifico', cursive;
}

/* Primary text color */
.text-primary {
    color: var(--primary-color, #8B4513); /* fallback color */
}

.text-primaryLight {
    color: var(--primary-light-color, #A0522D); /* fallback color */
}

/* Content area styling */
.ck-content {
    line-height: 1.8;
}

.ck-content p {
    margin-bottom: 1rem;
}

.ck-content a {
    color: var(--primary-color, #8B4513);
    text-decoration: underline;
}

.ck-content a:hover {
    opacity: 0.8;
}

/* Favorite button */
.favorite-btn {
    cursor: pointer;
    transition: transform 0.2s;
}

.favorite-btn:hover {
    transform: scale(1.1);
}

/* Responsive adjustments */
@media (max-width: 1279px) {
    .font-pacifico {
        font-size: 2rem;
        line-height: 2.5rem;
    }
}

@media (min-width: 1280px) {
    .xl\:text-\[64px\] {
        font-size: 64px;
        line-height: 1.2;
    }
}

/* Ensure Tailwind-like responsive classes work */
@media (min-width: 1536px) {
    .3xl\:pl-16 {
        padding-left: 4rem;
    }
    
    .3xl\:pr-0 {
        padding-right: 0;
    }
    
    .3xl\:px-16 {
        padding-left: 4rem;
        padding-right: 4rem;
    }
    
    .3xl\:pb-\[120px\] {
        padding-bottom: 120px;
    }
    
    .3xl\:mt-\[120px\] {
        margin-top: 120px;
    }
}