/* =========================================================================
   InstaBot — Action button emphasis
   Highlights key CTAs so they stand out from secondary actions.
   Classes are added at runtime by public/custom.js based on button text.
   ========================================================================= */

/* ---- PRIMARY CTA ----
   Affirmative / final actions: ✅ Χρήση, ✅ Έγκριση Post
   Solid gradient, white text, subtle glow, clear "do this next" signal. */
button.primary-cta,
a.primary-cta {
    background: linear-gradient(135deg, #16a34a 0%, #15803d 100%) !important;
    color: #ffffff !important;
    border: 1px solid #15803d !important;
    font-weight: 600 !important;
    box-shadow: 0 2px 10px rgba(22, 163, 74, 0.35),
                0 1px 2px rgba(0, 0, 0, 0.05) !important;
    transition: all 0.15s ease-in-out !important;
}

button.primary-cta:hover,
a.primary-cta:hover {
    background: linear-gradient(135deg, #15803d 0%, #14532d 100%) !important;
    box-shadow: 0 4px 14px rgba(22, 163, 74, 0.45),
                0 2px 4px rgba(0, 0, 0, 0.08) !important;
    transform: translateY(-1px);
}

button.primary-cta:active,
a.primary-cta:active {
    transform: translateY(0);
    box-shadow: 0 1px 6px rgba(22, 163, 74, 0.35) !important;
}

/* ---- PRESET CTA ----
   Shortcut/default actions: "Default (bottom-right L 100%)" etc.
   Softer tinted background — noticeable but less bold than primary. */
button.preset-cta,
a.preset-cta {
    background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%) !important;
    color: #1e40af !important;
    border: 1px solid #93c5fd !important;
    font-weight: 500 !important;
    box-shadow: 0 1px 3px rgba(59, 130, 246, 0.12) !important;
    transition: all 0.15s ease-in-out !important;
}

button.preset-cta:hover,
a.preset-cta:hover {
    background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%) !important;
    border-color: #60a5fa !important;
    box-shadow: 0 2px 6px rgba(59, 130, 246, 0.22) !important;
}

/* ---- DESTRUCTIVE CTA ----
   Actions that remove/reset: 🧹 Αφαίρεσε Κείμενο, 🚫 Αφαίρεσε Logo
   Subtle red tint so user knows it's a "remove" action. */
button.destructive-cta,
a.destructive-cta {
    background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%) !important;
    color: #b91c1c !important;
    border: 1px solid #fca5a5 !important;
    font-weight: 500 !important;
    transition: all 0.15s ease-in-out !important;
}

button.destructive-cta:hover,
a.destructive-cta:hover {
    background: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%) !important;
    border-color: #f87171 !important;
}
