/**
 * Acumen Brand Design Tokens & Variables for Gutenberg Blocks
 * Scoped and modular for exglem child theme
 */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');

:root,
.editor-styles-wrapper {
  /* Base Colors */
  --white: #FFFFFF;
  --dark: #0A1B2E;
  --mint: #00C7BE;
  --mint-hover: #4DD8D2;
  --red: #FF5A5F;
  --red-hover: #F24448;

  /* Text Colors */
  --text-gray: #475462;
  --text-light: #9198A1;
  --text-white: rgba(255, 255, 255, 0.7);
  --x-text-white-solid: #B5BBC0;

  /* Backgrounds & Overlays */
  --bg-gray: #F7F8F8;
  --ice-gray: #F4F6F8;
  --bg-white-4: rgba(255, 255, 255, 0.04);
  --x-bg-white-4-solid: #142436;
  --bg-white-6: rgba(255, 255, 255, 0.06);
  --x-bg-white-6-solid: #19293B;
  --bg-mint-4: rgba(0, 199, 190, 0.04);
  --x-bg-mint-4-solid: #0A2234;
  --bg-mint-6: rgba(0, 199, 190, 0.06);
  --x-bg-mint-6-solid: #F0FCFB;
  --mint-5: rgba(0, 199, 190, 0.05);
  --x-mint-5-solid: #F2FCFC;

  /* Strokes & Borders */
  --stroke-dark-10: rgba(10, 27, 46, 0.1);
  --x-stroke-dark-10-solid: #E7E8EA;
  --stroke-dark-20: rgba(10, 27, 46, 0.2);
  --x-stroke-dark-20-solid: #CED1D5;
  --stroke-white: rgba(255, 255, 255, 0.1);
  --stroke-white-10: rgba(255, 255, 255, 0.1);
  --x-stroke-white-10-solid: #233243;
  --stroke-white-30: rgba(255, 255, 255, 0.3);
  --x-stroke-white-30-solid: #545F6D;
  --stroke-white-50: rgba(255, 255, 255, 0.5);
  --x-stroke-white-50-solid: #858D97;
  --stroke-mint: rgba(0, 199, 190, 0.2);
  --stroke-mint-20: rgba(0, 199, 190, 0.2);
  --x-stroke-mint-20-solid: #083D4B;
  --stroke-mint-50: rgba(0, 199, 190, 0.5);
  --x-stroke-mint-50-solid: #057176;
  --stroke-mint-70: rgba(0, 199, 190, 0.7);
  --x-stroke-mint-70-solid: #039393;

  /* Overlays & Depth */
  --black-10: rgba(0, 0, 0, 0.1);
  --x-black-10-solid: #091829;
  --black-15: rgba(0, 0, 0, 0.15);
  --x-black-15-solid: #091727;

  /* Border Radii */
  --radius-small: 4px;
  --radius-btn: 8px;
  --radius-small-card: 12px;
  --radius-card: 16px;
  --radius-card-large: 20px;
  --radius-round: 500px;

  /* Typography Scale */
  --font-main: 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
  --h-h1-size: 64px;
  --h-h1-weight: 600;
  --h-h1-line-height: 1.2;

  --h-h2-size: 48px;
  --h-h2-weight: 600;
  --h-h2-line-height: 1.2;

  --s-s1-size: 32px;
  --s-s1-weight: 600;
  --s-s1-line-height: 1.2;

  --s-s2-size: 24px;
  --s-s2-weight: 500;
  --s-s2-line-height: 1.6;

  --s-s3-size: 20px;
  --s-s3-weight: 500;
  --s-s3-line-height: 1.6;

  --s-s3-semibold-size: 20px;
  --s-s3-semibold-weight: 600;
  --s-s3-semibold-line-height: 1.4;

  --s-s4-size: 36px;
  --s-s4-weight: 600;
  --s-s4-line-height: 1.4;

  --s-s5-size: 18px;
  --s-s5-weight: 400;
  --s-s5-line-height: 1.6;

  --b1-size: 16px;
  --b1-line-height: 1.6;

  --b2-size: 14px;
  --b2-line-height: 1.6;

  --b3-size: 12px;
  --b3-line-height: 1.6;

  --b4-size: 10px;
  --b4-letter-spacing: 0.2px;
  --b4-line-height: 1.6;

  --caption-size: 14px;
  --caption-weight: 500;
  --caption-letter-spacing: 0.28px;
  --caption-line-height: 1.6;

  --caption-small-size: 12px;
  --caption-small-weight: 500;
  --caption-small-letter-spacing: 0.24px;
  --caption-small-line-height: 1.6;

  /* Mobile Typography */
  --h1-mobile-size: 40px;
  --h1-mobile-weight: 600;
  --h1-mobile-line-height: 1.2;

  --h2-mobile-size: 32px;
  --h2-mobile-weight: 600;
  --h2-mobile-line-height: 1.2;

  --caption-small-mobile-size: 10px;
  --caption-small-mobile-weight: 500;
  --caption-small-mobile-letter-spacing: 0.2px;
  --caption-small-mobile-line-height: 1.6;
}

/* Base Buttons inside custom block sections */
[class*="homepage-hero"] .wp-block-button__link,
[class*="country-hiring-CTA"] .wp-block-button__link,
[class*="expert-advantage-why"] .wp-block-button__link,
[class*="process-steps"] .wp-block-button__link,
[class*="services-grid"] .wp-block-button__link,
[class*="founder-leadership"] .wp-block-button__link,
[class*="comparison-section"] .wp-block-button__link,
[class*="service-page-hero"] .wp-block-button__link,
[class*="market-coverage"] .wp-block-button__link,
[class*="checklist-long"] .wp-block-button__link,
[class*="challenge-problem"] .wp-block-button__link,
[class*="vendor-consolidation"] .wp-block-button__link,
[class*="vision-promise"] .wp-block-button__link,
[class*="detailed-capability"] .wp-block-button__link,
[class*="company-overview"] .wp-block-button__link,
[class*="newsletter-promo"] .wp-block-button__link,
[class*="contact-locations"] .wp-block-button__link,
[class*="contact-form-section"] .wp-block-button__link,
[class*="countries-page"] .wp-block-button__link,
.btn-mint .wp-block-button__link {
  font-family: var(--font-main);
  border-radius: var(--radius-btn);
  font-weight: 600;
  transition: all 0.2s ease;
}

/* Universal Table Wrapper for Mobile Horizontal Scroll */
.acumen-table-scroll-wrapper {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: 24px 0;
  position: relative;
  scrollbar-width: thin;
  scrollbar-color: var(--mint) rgba(10, 27, 46, 0.1);
}

.acumen-table-scroll-wrapper::-webkit-scrollbar {
  height: 6px;
}

.acumen-table-scroll-wrapper::-webkit-scrollbar-track {
  background: rgba(10, 27, 46, 0.05);
  border-radius: 4px;
}

.acumen-table-scroll-wrapper::-webkit-scrollbar-thumb {
  background: var(--mint);
  border-radius: 4px;
}

.table-scroll-hint {
  display: none;
  font-family: var(--font-main);
  font-size: 12px;
  color: var(--text-light);
  text-align: center;
  margin-bottom: 8px;
}

@media (max-width: 768px) {
  .table-scroll-hint {
    display: block;
  }
}