/* Viva Energy Custom Branding Colors */
/* Primary Green: #70EC9A */
/* Primary Blue: #0090F7 */

:root {
    --viva-green: #70EC9A;
    --viva-blue: #0090F7;
}

/* Primary buttons and CTAs */
.btn,
button,
input[type="button"],
input[type="submit"] {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.btn-primary,
.btn-home.btn-primary,
a.btn-primary,
a.btn-home.btn-primary {
    background: linear-gradient(135deg, var(--viva-blue) 0%, #0076d0 100%) !important;
    border: none !important;
    color: #fff !important;
    font-weight: 600;
    box-shadow: 0 4px 15px rgba(0, 144, 247, 0.3) !important;
    position: relative;
    overflow: hidden;
}

.btn-primary:hover,
.btn-home.btn-primary:hover,
a.btn-primary:hover,
a.btn-home.btn-primary:hover {
    background: linear-gradient(135deg, #0076d0 0%, var(--viva-blue) 100%) !important;
    box-shadow: 0 6px 25px rgba(0, 144, 247, 0.5) !important;
    transform: translateY(-2px);
}

.btn-primary:active,
.btn-home.btn-primary:active,
a.btn-primary:active,
a.btn-home.btn-primary:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(0, 144, 247, 0.4) !important;
}

/* Secondary buttons */
.btn-secondary,
.btn-home.btn-secondary {
    background: linear-gradient(135deg, var(--viva-green) 0%, #5ce08a 100%) !important;
    border: none !important;
    color: #1a1a1a !important;
    font-weight: 600;
    box-shadow: 0 4px 15px rgba(112, 236, 154, 0.3) !important;
    position: relative;
    overflow: hidden;
}

.btn-secondary:hover,
.btn-home.btn-secondary:hover {
    background: linear-gradient(135deg, #5ce08a 0%, var(--viva-green) 100%) !important;
    box-shadow: 0 6px 25px rgba(112, 236, 154, 0.5) !important;
    transform: translateY(-2px);
    color: #1a1a1a !important;
}

.btn-secondary:active,
.btn-home.btn-secondary:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(112, 236, 154, 0.4) !important;
}

/* Navigation highlights and active states */
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active,
.navbar-nav .nav-item:hover .nav-link {
    color: var(--viva-green) !important;
}

/* Links */
a {
    color: var(--viva-blue);
    transition: color 0.2s ease;
}

a:hover {
    color: var(--viva-green);
}

/* Section backgrounds and accents */
.section-home-hero {
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
}

/* Footer styling */
.site-footer {
    border-top: 3px solid var(--viva-green);
}

/* Hover effects for menu items */
.menu-item:hover > a {
    color: var(--viva-green) !important;
}

/* Dropdown menu styling */
.dropdown-menu {
    border-top: 3px solid var(--viva-green);
}

.dropdown-menu a:hover {
    color: var(--viva-green) !important;
    background-color: rgba(112, 236, 154, 0.1);
}

/* Input focus states */
input:focus,
textarea:focus,
select:focus {
    border-color: var(--viva-blue) !important;
    box-shadow: 0 0 0 0.2rem rgba(0, 144, 247, 0.25) !important;
}

/* Custom heading colors */
h1, h2, h3, h4, h5, h6 {
    color: #1a1a1a;
}

.text-light h1,
.text-light h2,
.text-light h3,
.text-light h4,
.text-light h5,
.text-light h6 {
    color: #fff;
}

/* Badge and alert styling */
.badge-primary {
    background-color: var(--viva-blue) !important;
}

.badge-success {
    background-color: var(--viva-green) !important;
}

.alert-info {
    background-color: rgba(0, 144, 247, 0.1);
    border-color: var(--viva-blue);
    color: var(--viva-blue);
}

.alert-success {
    background-color: rgba(112, 236, 154, 0.1);
    border-color: var(--viva-green);
    color: #1a5d3a;
}

/* Social media icons */
.social a:hover {
    color: var(--viva-green) !important;
}

/* Product/service cards */
.card {
    border-top: 4px solid var(--viva-blue);
}

.card:hover {
    border-top-color: var(--viva-green);
    box-shadow: 0 4px 15px rgba(0, 144, 247, 0.2);
}

/* Pricing table emphasis */
.table-striped tbody tr:hover {
    background-color: rgba(112, 236, 154, 0.05);
}

/* Custom gradient overlays */
.bg-gradient-viva {
    background: linear-gradient(135deg, var(--viva-blue) 0%, var(--viva-green) 100%) !important;
}

/* Accent underlines and borders */
.border-viva-top {
    border-top: 3px solid var(--viva-green) !important;
}

.border-viva-bottom {
    border-bottom: 3px solid var(--viva-blue) !important;
}