/*
Theme Name:   Remotiko Astra Child
Theme URI:    https://remotiko.com
Description:  Astra child theme for the Remotiko remote job board.
              Add all site-specific CSS overrides below the import line.
Author:       Remotiko
Template:     astra
Version:      1.0.0
Text Domain:  remotiko-astra-child
*/

/*
 * Import Astra parent styles first so child overrides always win.
 * Do NOT remove this line.
 */
@import url('../astra/style.css');
/* === GOOGLE FONTS === */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Playfair+Display:wght@700;800&display=swap');

/* ============================================================
   SITE-SPECIFIC OVERRIDES
   Add your custom CSS below this line.
   ============================================================ */


/* Hide WP Job Manager RSS feed link */
.job_listings .feed-link,
a[href*="feed=job_feed"] {
    display: none !important;
}

/* === TYPOGRAPHY === */
body, p, input, textarea, select, button {
    font-family: 'Inter', sans-serif;
}

h1, h2, h3, h4, h5, h6,
.elementor-heading-title,
.elementor-widget-heading h1,
.elementor-widget-heading h2,
.elementor-widget-heading h3,
.entry-title, .page-title,
.wp-block-heading,
[class*="elementor"] h1,
[class*="elementor"] h2 {
    font-family: 'Playfair Display', Georgia, serif !important;
    font-weight: 700;
    color: #1A1A2E;
    text-transform: none !important;
    letter-spacing: normal !important;
}

/* === BUTTONS === */
/* Elementor buttons */
.elementor-button,
.elementor-button-wrapper .elementor-button {
    background-color: #6B21A8;
    border-color: #6B21A8;
    color: #FFFFFF !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 600 !important;
}
.elementor-button:hover,
.elementor-button-wrapper .elementor-button:hover {
    background-color: #F59E0B !important;
    border-color: #F59E0B !important;
    color: #FFFFFF !important;
}

/* Gutenberg buttons */
.wp-block-button__link {
    background-color: #6B21A8 !important;
    border-color: #6B21A8 !important;
    color: #FFFFFF !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 600 !important;
    border-radius: 50px !important;
    padding: 14px 36px !important;
}
.wp-block-button__link:hover {
    background-color: #F59E0B !important;
    border-color: #F59E0B !important;
    color: #FFFFFF !important;
}

/* Astra theme buttons */
.ast-btn, a.ast-btn,
input[type="submit"],
button[type="submit"] {
    background-color: #6B21A8 !important;
    border-color: #6B21A8 !important;
    color: #FFFFFF !important;
}
.ast-btn:hover, a.ast-btn:hover {
    background-color: #F59E0B !important;
    border-color: #F59E0B !important;
}

/* === NAVIGATION === */
.main-header-menu > li > a,
.ast-primary-menu-area .main-navigation a {
    font-family: 'Inter', sans-serif !important;
    font-weight: 500 !important;
    color: #1A1A2E !important;
    letter-spacing: 0.02em;
}
.main-header-menu > li > a:hover,
.ast-primary-menu-area .main-navigation a:hover {
    color: #6B21A8 !important;
}

/* FIND JOBS header button */
.ast-header-button-1 a:hover {
    background-color: #581c87 !important;
    color: #FFFFFF !important;
}
.ast-header-button-1,
.ast-header-button-1 .ast-builder-button-wrap {
    background: transparent !important;
}
/* === LINKS === */
a { color: #6B21A8; }
a:hover { color: #F59E0B; }

/* === BODY TEXT === */
body, p {
    color: #1A1A2E;
    font-size: 16px;
    line-height: 1.7;
}
    /* ============================================================
   REMOTIKO DESIGN TOKENS
   ============================================================ */
:root {
    --remotiko-purple:            #6B21A8;
    --remotiko-purple-light:      #EDE9FE;
    --remotiko-purple-mid:        #C4B5FD;
    --remotiko-gold:              #F59E0B;
    --remotiko-gold-light:        #FEF3C7;
    --remotiko-gold-dark:         #92400E;
    --remotiko-verified:          #10B981;
    --remotiko-verified-light:    #D1FAE5;
    --remotiko-africa:            #3B82F6;
    --remotiko-africa-light:      #DBEAFE;
    --remotiko-latam:             #14B8A6;
    --remotiko-latam-light:       #CCFBF1;
    --remotiko-card-border:       rgba(0, 0, 0, 0.08);
    --remotiko-card-radius:       12px;
    --remotiko-tag-radius:        100px;
    --bp-mobile:                  480px;
    --bp-tablet:                  768px;
    --bp-desktop:                 1024px;
}

/* ============================================================
   REMOTIKO UTILITY: VERIFIED INDICATOR
   ============================================================ */
.remotiko-verified-dot {
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: var(--remotiko-verified);
    flex-shrink: 0;
}
.remotiko-verified-text {
    font-size: 11px;
    font-weight: 600;
    color: var(--remotiko-verified);
    line-height: 1;
}

/* ============================================================
   REMOTIKO UTILITY: BADGES
   ============================================================ */
.remotiko-badge-new,
.remotiko-badge-featured {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: var(--remotiko-tag-radius);
    font-size: 10px;
    font-weight: 700;
    line-height: 1.4;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.remotiko-badge-new {
    background-color: var(--remotiko-purple-light);
    color: var(--remotiko-purple);
}
.remotiko-badge-featured {
    background-color: var(--remotiko-gold-light);
    color: var(--remotiko-gold-dark);
}

/* ============================================================
   REMOTIKO UTILITY: TAGS / PILLS
   ============================================================ */
.rtag {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: var(--remotiko-tag-radius);
    font-size: 11px;
    font-weight: 500;
    line-height: 1.4;
    background-color: #F3F4F6;
    color: #374151;
    white-space: nowrap;
}
.rtag-purple { background-color: var(--remotiko-purple-light); color: var(--remotiko-purple); }
.rtag-gold   { background-color: var(--remotiko-gold-light);   color: var(--remotiko-gold-dark); }
.rtag-green  { background-color: var(--remotiko-verified-light); color: var(--remotiko-verified); }
.rtag-blue   { background-color: var(--remotiko-africa-light);  color: var(--remotiko-africa); }
.rtag-teal   { background-color: var(--remotiko-latam-light);   color: var(--remotiko-latam); }

/* ============================================================
   REMOTIKO UTILITY: BUTTONS
   ============================================================ */
.rbtn-primary, .rbtn-secondary, .rbtn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    font-size: 14px;
    line-height: 1;
    border-radius: 8px;
    cursor: pointer;
    transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
    text-decoration: none;
}
.rbtn-primary {
    padding: 10px 20px;
    background-color: var(--remotiko-purple);
    color: #FFFFFF;
    border: 2px solid var(--remotiko-purple);
}
.rbtn-primary:hover { background-color: #581c87; border-color: #581c87; color: #FFFFFF; }
.rbtn-secondary {
    padding: 10px 20px;
    background-color: #FFFFFF;
    color: var(--remotiko-purple);
    border: 2px solid var(--remotiko-purple);
}
.rbtn-secondary:hover { background-color: var(--remotiko-purple-light); color: var(--remotiko-purple); }
.rbtn-icon {
    width: 36px;
    height: 36px;
    padding: 0;
    background-color: #F9FAFB;
    color: #6B7280;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
}
.rbtn-icon:hover { background-color: var(--remotiko-purple-light); color: var(--remotiko-purple); border-color: var(--remotiko-purple-mid); 
}