/*
Theme Name: TIC Ltd Child
Template: hello-elementor
Version: 1.0.0
Description: Child theme for TIC Ltd website custom styles and service page systems.
Author: The Ideas Cupboard
*/

/*
 * TIC global Elementor button styles.
 *
 * Use these classes on Elementor Button widgets across manually built pages:
 * - tic-button-primary
 * - tic-button-secondary
 *
 * Optional helper classes for the parent button container:
 * - tic-button-row
 * - tic-mobile-stack
 * - tic-gap-compact
 */

:root {
  --tic-button-text: #ffffff;
  --tic-button-purple: #8b2cff;
  --tic-button-magenta: #f92dff;
  --tic-button-cyan: #20c9ff;
  --tic-button-border: rgba(32, 201, 255, 0.28);
  --tic-button-shadow-cyan: 0 0 28px rgba(32, 201, 255, 0.26);
}

.tic-button-primary .elementor-button,
.tic-button-primary.elementor-button,
.tic-button-secondary .elementor-button,
.tic-button-secondary.elementor-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 15px 26px;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: 0.04em;
  text-decoration: none;
  text-transform: uppercase;
  transition:
    transform 180ms ease,
    box-shadow 180ms ease,
    border-color 180ms ease,
    background 180ms ease;
}

.tic-button-primary .elementor-button,
.tic-button-primary.elementor-button {
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: var(--tic-button-text);
  background: linear-gradient(135deg, var(--tic-button-purple), var(--tic-button-magenta));
  box-shadow: 0 0 24px rgba(32, 201, 255, 0.34);
}

.tic-button-secondary .elementor-button,
.tic-button-secondary.elementor-button {
  border: 1px solid var(--tic-button-border);
  color: var(--tic-button-text);
  background: rgba(255, 255, 255, 0.03);
}

.tic-button-primary .elementor-button:hover,
.tic-button-primary .elementor-button:focus,
.tic-button-primary.elementor-button:hover,
.tic-button-primary.elementor-button:focus,
.tic-button-secondary .elementor-button:hover,
.tic-button-secondary .elementor-button:focus,
.tic-button-secondary.elementor-button:hover,
.tic-button-secondary.elementor-button:focus {
  transform: translateY(-2px);
  border-color: var(--tic-button-cyan);
  color: var(--tic-button-text);
  box-shadow: var(--tic-button-shadow-cyan);
}

.tic-button-row,
.tic-mobile-stack,
.tic-gap-compact {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

.tic-button-row,
.tic-mobile-stack {
  align-items: center;
}

@media (max-width: 767px) {
  .tic-mobile-stack {
    flex-direction: column;
    align-items: stretch;
  }

  .tic-button-primary .elementor-button,
  .tic-button-primary.elementor-button,
  .tic-button-secondary .elementor-button,
  .tic-button-secondary.elementor-button {
    width: 100%;
    max-width: 360px;
  }
}