/* Wessex Honey Custom Styles */

/* ==============================================
   Honey Input Styles
   ============================================== */

.honey-input {
    @apply w-full px-4 py-3 rounded-lg border-2 border-honey/30 bg-white text-charcoal;
    @apply focus:border-honey focus:ring-4 focus:ring-honey/20 focus:outline-none;
    @apply transition-all duration-200;
    @apply placeholder:text-gray-400;
}

.honey-input:hover {
    @apply border-honey/50;
}

.honey-input:disabled {
    @apply bg-gray-100 cursor-not-allowed opacity-60;
}

.honey-input.error {
    @apply border-red-500 focus:border-red-500 focus:ring-red-500/20;
}

/* Honey Textarea */
textarea.honey-input {
    @apply min-h-[120px] resize-y;
}

/* Honey Select */
select.honey-input {
    @apply pr-10 appearance-none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23E8A21A'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 1.5rem;
}

/* Honey Checkbox */
.honey-checkbox {
    @apply w-5 h-5 text-honey border-2 border-honey/30 rounded;
    @apply focus:ring-4 focus:ring-honey/20 focus:ring-offset-0;
    @apply transition-colors duration-200;
    @apply cursor-pointer;
}

.honey-checkbox:checked {
    @apply bg-honey border-honey;
}

/* Honey Radio */
.honey-radio {
    @apply w-5 h-5 text-honey border-2 border-honey/30;
    @apply focus:ring-4 focus:ring-honey/20 focus:ring-offset-0;
    @apply transition-colors duration-200;
    @apply cursor-pointer;
}

.honey-radio:checked {
    @apply bg-honey border-honey;
}

/* Honey Label */
.honey-label {
    @apply block text-sm font-semibold text-charcoal mb-2;
}

/* Honey Form Group */
.honey-form-group {
    @apply space-y-2 mb-4;
}

/* Honey Error Message */
.honey-error {
    @apply text-sm text-red-600 mt-1;
}

/* Honey Helper Text */
.honey-helper {
    @apply text-sm text-gray-600 mt-1;
}

/* ==============================================
   Animations
   ============================================== */

/* Honeycomb Animation */
@keyframes honeycomb-float {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-10px); }
}

.honeycomb-float {
    animation: honeycomb-float 6s ease-in-out infinite;
}

/* Honey Drip Effect */
@keyframes honey-drip {
    0% { transform: translateY(-100%); opacity: 0; }
    50% { opacity: 1; }
    100% { transform: translateY(0); opacity: 1; }
}

.honey-drip {
    animation: honey-drip 0.8s ease-out forwards;
}

/* Gradient Overlays */
.honey-gradient {
    background: linear-gradient(135deg, #F6E7C8 0%, #E8A21A 50%, #C88500 100%);
}

.honey-gradient-subtle {
    background: linear-gradient(to bottom, #FFF8E8 0%, #F6E7C8 100%);
}

/* Hexagon Clip Path (for bee-related design elements) */
.hexagon {
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
}

/* Hover Effects */
.honey-hover {
    transition: all 0.3s ease;
}

.honey-hover:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(232, 162, 26, 0.2);
}

/* Bee Icon Animation */
@keyframes bee-buzz {
    0%, 100% { transform: translate(0, 0) rotate(-5deg); }
    25% { transform: translate(2px, -2px) rotate(0deg); }
    50% { transform: translate(0, -4px) rotate(5deg); }
    75% { transform: translate(-2px, -2px) rotate(0deg); }
}

.bee-buzz {
    display: inline-block;
    animation: bee-buzz 2s ease-in-out infinite;
}

/* Loading Honey Spinner */
@keyframes honey-spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.honey-spinner {
    border: 3px solid #F6E7C8;
    border-top: 3px solid #E8A21A;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    animation: honey-spin 1s linear infinite;
}

/* Sticky Header Effect */
.sticky-honey-header {
    position: sticky;
    top: 0;
    z-index: 50;
    backdrop-filter: blur(10px);
    background-color: rgba(255, 248, 232, 0.95);
    border-bottom: 2px solid #E8A21A;
}

/* Product Card Shine Effect */
.product-shine {
    position: relative;
    overflow: hidden;
}

.product-shine::after {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: linear-gradient(
        to bottom right,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.1) 50%,
        rgba(255, 255, 255, 0) 100%
    );
    transform: rotate(45deg);
    transition: all 0.6s;
}

.product-shine:hover::after {
    left: 100%;
}

/* Badge Pulse Animation */
@keyframes badge-pulse {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.05); opacity: 0.9; }
}

.badge-pulse {
    animation: badge-pulse 2s ease-in-out infinite;
}

/* Custom Scrollbar */
.honey-scrollbar::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.honey-scrollbar::-webkit-scrollbar-track {
    background: #FFF8E8;
    border-radius: 4px;
}

.honey-scrollbar::-webkit-scrollbar-thumb {
    background: #E8A21A;
    border-radius: 4px;
}

.honey-scrollbar::-webkit-scrollbar-thumb:hover {
    background: #C88500;
}

/* Toast Slide In Animation (already defined but enhanced) */
@keyframes slide-in-right-bounce {
    0% {
        transform: translateX(100%);
        opacity: 0;
    }
    60% {
        transform: translateX(-10px);
        opacity: 1;
    }
    80% {
        transform: translateX(5px);
    }
    100% {
        transform: translateX(0);
    }
}

.toast-bounce {
    animation: slide-in-right-bounce 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

/* Price Tag Style */
.price-tag {
    display: inline-block;
    padding: 0.5rem 1rem;
    background: linear-gradient(135deg, #E8A21A 0%, #C88500 100%);
    color: white;
    font-weight: bold;
    clip-path: polygon(0 0, 100% 0, 90% 50%, 100% 100%, 0 100%);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* Section Divider with Bee Icon */
.honey-divider {
    display: flex;
    align-items: center;
    text-align: center;
    margin: 2rem 0;
}

.honey-divider::before,
.honey-divider::after {
    content: '';
    flex: 1;
    border-bottom: 2px solid #E8A21A;
}

.honey-divider::before {
    margin-right: 1rem;
}

.honey-divider::after {
    margin-left: 1rem;
}

/* Utility Classes */
.text-honey {
    color: #E8A21A;
}

.text-honey-dark {
    color: #C88500;
}

.text-honey-light {
    color: #F6E7C8;
}

.bg-honey-pattern {
    background-image: 
        radial-gradient(circle at 20% 50%, rgba(232, 162, 26, 0.05) 0%, transparent 50%),
        radial-gradient(circle at 80% 80%, rgba(246, 231, 200, 0.05) 0%, transparent 50%);
}

/* Focus Ring - Honey Theme */
.focus-honey:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(232, 162, 26, 0.5);
}

/* Admin Theme Overrides */
.admin-theme .honey-gradient {
    background: linear-gradient(135deg, #4A6B3B 0%, #3a5530 100%);
}

.admin-theme .focus-honey:focus {
    box-shadow: 0 0 0 3px rgba(74, 107, 59, 0.5);
}
