/* TJ360 Growth Suite — Widget Styles */

/* ── Alert Form ───────────────────────────────────────────── */
.tj360gs-alert-form {
    background: linear-gradient(135deg, #1e1b4b, #312e81);
    border-radius: 16px;
    padding: 2rem;
    margin: 2rem 0;
    color: #fff;
}
.tj360gs-alert-inner h3 {
    margin: 0 0 .5rem;
    font-size: 1.4rem;
    color: #fff;
}
.tj360gs-alert-inner p {
    color: #c7d2fe;
    margin: 0 0 1.25rem;
}
.tj360gs-fields {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem;
    margin-bottom: 1rem;
}
.tj360gs-input {
    padding: 10px 14px;
    border-radius: 8px;
    border: none;
    font-size: .9rem;
    flex: 1;
    min-width: 180px;
    background: rgba(255,255,255,.15);
    color: #fff;
    outline: none;
}
.tj360gs-input::placeholder { color: #a5b4fc; }
.tj360gs-input option        { color: #0f172a; }
.tj360gs-btn {
    display: inline-block;
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
    color: #fff;
    border: none;
    padding: 12px 28px;
    border-radius: 10px;
    font-weight: 700;
    font-size: 1rem;
    cursor: pointer;
    transition: transform .2s, box-shadow .2s;
    text-decoration: none;
}
.tj360gs-btn:hover { transform: scale(1.03); box-shadow: 0 6px 20px rgba(99,102,241,.4); }
.tj360gs-privacy { font-size: .8rem; color: #a5b4fc; margin-top: .75rem; }
.tj360gs-msg { margin-top: .75rem; padding: .75rem 1rem; border-radius: 8px; font-weight: 600; }

/* ── Apply Section ─────────────────────────────────────────── */
.tj360gs-apply-section {
    background: linear-gradient(135deg, #eff6ff, #f0fdf4);
    border: 1px solid #bfdbfe;
    border-radius: 16px;
    padding: 1.75rem;
    margin: 2rem 0;
}
.tj360gs-apply-section h3 { margin: 0 0 1rem; color: #1e1b4b; }
.tj360gs-cta-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 1rem;
}
.tj360gs-cta-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 1.25rem;
    text-align: center;
}
.tj360gs-cta-icon   { font-size: 2rem; margin-bottom: .5rem; }
.tj360gs-cta-card h4 { margin: 0 0 .5rem; font-size: .95rem; color: #0f172a; }
.tj360gs-cta-card p  { font-size: .83rem; color: #64748b; margin-bottom: 1rem; }
.tj360gs-btn-green  { background: linear-gradient(135deg, #059669, #10b981); }
.tj360gs-btn-blue   { background: linear-gradient(135deg, #2563eb, #3b82f6); }
.tj360gs-btn-indigo { background: linear-gradient(135deg, #6366f1, #8b5cf6); }
.tj360gs-btn        { font-size: .85rem; padding: 8px 16px; }

/* ── Courses Section ───────────────────────────────────────── */
.tj360gs-courses-section {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 1.75rem;
    margin: 1.5rem 0;
}
.tj360gs-courses-section h3 { margin: 0 0 .25rem; color: #0f172a; }
.tj360gs-courses-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: .75rem;
    margin-top: 1rem;
}
.tj360gs-course-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .3rem;
    padding: 1rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    text-decoration: none;
    color: #0f172a;
    font-size: .85rem;
    text-align: center;
    transition: all .2s;
}
.tj360gs-course-card:hover  { border-color: #6366f1; background: #eff6ff; }
.tj360gs-course-icon        { font-size: 1.5rem; }
.tj360gs-course-price       { color: #059669; font-size: .78rem; font-weight: 700; }

/* ── Tools Row ─────────────────────────────────────────────── */
.tj360gs-tools-row {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem;
    margin: 1.25rem 0;
}
.tj360gs-tool-pill {
    display: inline-block;
    padding: 8px 16px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 100px;
    font-size: .85rem;
    text-decoration: none;
    color: #475569;
    transition: all .2s;
}
.tj360gs-tool-pill:hover         { border-color: #6366f1; color: #6366f1; background: #eff6ff; }
.tj360gs-tool-pill-cta           { background: linear-gradient(135deg, #6366f1, #8b5cf6); color: #fff; border: none; font-weight: 700; }
.tj360gs-tool-pill-cta:hover     { color: #fff; opacity: .9; }

/* ── Share Buttons ──────────────────────────────────────────── */
.tj360gs-share-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
    padding: 1rem 1.25rem;
    background: #f8fafc;
    border-radius: 12px;
    margin: 1.5rem 0;
    font-size: .9rem;
}
.tj360gs-share-btn {
    display: inline-block;
    padding: 6px 14px;
    border-radius: 100px;
    font-size: .82rem;
    font-weight: 600;
    text-decoration: none;
    color: #fff;
    transition: opacity .2s;
}
.tj360gs-share-btn:hover { opacity: .85; color: #fff; }
.tj360gs-share-x  { background: #000; }
.tj360gs-share-li { background: #0a66c2; }
.tj360gs-share-wa { background: #25d366; }

/* ── Responsive ────────────────────────────────────────────── */
@media (max-width: 600px) {
    .tj360gs-cta-grid, .tj360gs-courses-grid { grid-template-columns: 1fr; }
    .tj360gs-fields { flex-direction: column; }
    .tj360gs-input  { min-width: 100%; }
}