/* Outraged Hosting Theme CSS */

/* Angry color scheme */
:root {
  --angry-red: #ff4444;
  --rage-orange: #ff6600;
  --fury-yellow: #ffaa00;
  --mad-dark: #cc0000;
}

/* Subtle professional animations */
@keyframes shake {
  0%, 100% { transform: translateX(0); }
  50% { transform: translateX(-1px); }
}

/* Pulse animation for prices */
@keyframes pulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.05); }
  100% { transform: scale(1); }
}

/* Professional angry buttons */
.btn-success, .btn-info {
  background-color: var(--mad-dark) !important;
  border-color: var(--mad-dark) !important;
  color: white !important;
  transition: all 0.3s ease;
}

.btn-success:hover, .btn-info:hover, .btn-success:focus, .btn-info:focus {
  background-color: var(--angry-red) !important;
  border-color: var(--angry-red) !important;
  color: white !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(204, 0, 0, 0.3);
}

/* Professional navbar with angry accent */
.navbar-default {
  background-color: rgba(255, 255, 255, 0.95) !important;
  border-bottom: 3px solid var(--angry-red) !important;
}

.navbar-default .navbar-nav > li > a {
  color: #333 !important;
}

.navbar-default .navbar-nav > li > a:hover {
  color: var(--angry-red) !important;
}

.navbar-default .navbar-nav > .active > a {
  background-color: var(--angry-red) !important;
  color: white !important;
}

/* Dropdown menu styling */
.dropdown-menu {
  background-color: white !important;
  border: 2px solid var(--angry-red) !important;
}

.dropdown-menu > li > a {
  color: var(--mad-dark) !important;
}

.dropdown-menu > li > a:hover {
  background-color: var(--angry-red) !important;
  color: white !important;
}

/* Outrageous price styling */
.start h4 span {
  color: var(--angry-red) !important;
  font-weight: bold !important;
  animation: pulse 2s infinite;
  text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
}

/* Angry headings */
h1, h2 {
  text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
}

/* Mad features styling */
.features i {
  transition: all 0.3s ease;
  color: var(--angry-red) !important;
}

.features .col-md-4:hover i {
  transform: scale(1.2);
  animation: shake 0.3s;
  color: var(--mad-dark) !important;
}

/* Outraged testimonials */
.quote blockquote {
  border-left: 4px solid var(--angry-red);
}

.quote blockquote-reverse {
  border-right: 4px solid var(--angry-red);
}

/* Furious navbar brand */
.navbar-brand img {
  transition: all 0.3s ease;
}

.navbar-brand:hover img {
  animation: shake 0.5s;
}

/* Angry domain search */
.domainsearchsubmit:hover {
  animation: shake 0.3s;
  background-color: var(--angry-red) !important;
}

/* Mad support section */
.support {
  background: linear-gradient(45deg, var(--angry-red), var(--rage-orange)) !important;
}

.support h3 {
  color: white;
  text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
}

/* Outrageous pricing highlights */
.pricing-highlight {
  background: var(--angry-red);
  color: white;
  padding: 2px 8px;
  border-radius: 4px;
  font-weight: bold;
  animation: pulse 2s infinite;
}

/* Angry footer links */
.footer a:hover {
  color: var(--angry-red) !important;
  transition: color 0.3s ease;
}

/* Professional section with angry accent */
.whyus {
  background: linear-gradient(135deg, #f8f9fa, #ffffff) !important;
  border-left: 5px solid var(--angry-red) !important;
}

.whyus h2 {
  color: var(--mad-dark) !important;
}

.whyus i {
  color: var(--angry-red) !important;
}

/* Angry links - but not navbar */
.footer a, .content a {
  color: var(--angry-red) !important;
}

.footer a:hover, .content a:hover {
  color: var(--mad-dark) !important;
}

/* Mad check icons */
.fa-check-square-o {
  color: var(--angry-red) !important;
}

/* Furious panel headings */
.panel-default > .panel-heading {
  background-color: var(--angry-red) !important;
  border-color: var(--mad-dark) !important;
}

.panel-default > .panel-heading a {
  color: white !important;
}