/* InstaWhat visual refresh — colors only.
 * Layout, forms, endpoints and existing features are intentionally untouched.
 */
:root {
  --iw-bg: #0b1020;
  --iw-bg-2: #121a2d;
  --iw-surface: #17243a;
  --iw-surface-2: #1d2d46;
  --iw-border: rgba(255,255,255,.12);
  --iw-text: #f7f7fb;
  --iw-muted: #b8c0cf;
  --iw-pink: #f43f8a;
  --iw-purple: #8b5cf6;
  --iw-orange: #ff9d2e;
  --iw-blue: #5b7cfa;
  --iw-shadow: 0 18px 45px rgba(0,0,0,.28);
}

html, body {
  background: radial-gradient(circle at 85% 10%, rgba(244,63,138,.16), transparent 26%),
              radial-gradient(circle at 10% 20%, rgba(91,124,250,.15), transparent 28%),
              linear-gradient(135deg, var(--iw-bg), #0e1526 48%, #141323);
  color: var(--iw-text);
  min-height: 100%;
}

body {
  color: var(--iw-text);
}

/* Navbar */
.navbar-default {
  background: rgba(10,15,29,.96);
  border: 0;
  border-bottom: 1px solid var(--iw-border);
  box-shadow: 0 8px 25px rgba(0,0,0,.22);
}
.navbar-default .navbar-brand,
.navbar-default .navbar-text,
.navbar-default .navbar-nav > li > a,
.navbar-default .navbar-link {
  color: #f4f5fa;
}
.navbar-default .navbar-brand {
  font-weight: 800;
  letter-spacing: .2px;
}
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus,
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  color: #fff;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
  color: #fff;
  background: linear-gradient(90deg, rgba(244,63,138,.42), rgba(255,157,46,.30));
}
.navbar-default .navbar-toggle {
  border-color: rgba(255,255,255,.22);
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
  background: rgba(244,63,138,.20);
}
.navbar-default .navbar-toggle .icon-bar {
  background-color: #fff;
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
  border-color: var(--iw-border);
}

/* General text / links */
a,
a:hover,
a:focus {
  color: #ff78ad;
}
.text-muted {
  color: var(--iw-muted);
}
.page-header {
  border-color: var(--iw-border);
}
hr {
  border-color: var(--iw-border);
}

/* Panels/cards */
.panel,
.panel-default,
.panel-info,
.panel-success,
.panel-warning,
.panel-danger,
.panel-primary {
  background: linear-gradient(145deg, rgba(23,36,58,.97), rgba(14,23,40,.97));
  border: 1px solid var(--iw-border);
  border-radius: 18px;
  color: var(--iw-text);
  box-shadow: var(--iw-shadow);
  overflow: hidden;
}
.panel-heading,
.panel-info > .panel-heading,
.panel-success > .panel-heading,
.panel-warning > .panel-heading,
.panel-danger > .panel-heading,
.panel-primary > .panel-heading {
  color: #fff;
  background: linear-gradient(90deg, rgba(244,63,138,.20), rgba(139,92,246,.18), rgba(255,157,46,.16));
  border-color: var(--iw-border);
}
.panel-footer {
  color: var(--iw-muted);
  background: rgba(0,0,0,.16);
  border-color: var(--iw-border);
}

/* Dashboard profile card */
.highlight-one .bullet-one {
  background: linear-gradient(135deg, rgba(30, 20, 50, 0.75), rgba(76, 29, 149, 0.65)), url(../images/slide_4.jpg) center/cover no-repeat !important;
  border-bottom: 1px solid var(--iw-border);
}
.highlight-two {
  width: 100px !important;
  height: 100px !important;
  max-width: 100px !important;
  max-height: 100px !important;
  object-fit: cover !important;
  border-radius: 50% !important;
  border: 3px solid rgba(255,255,255,.88) !important;
  box-shadow: 0 4px 18px rgba(0,0,0,.35) !important;
  display: inline-block !important;
  margin-top: -50px !important;
  margin-bottom: 8px !important;
}
.ul-list {
  border-right-color: var(--iw-border);
}
.slide b,
#followers {
  color: #ff77ab !important;
}

/* Forms */
.form-control,
input.form-control,
textarea.form-control,
select.form-control {
  color: #fff;
  background: rgba(8,14,27,.72);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 10px;
  box-shadow: inset 0 1px 1px rgba(0,0,0,.16);
}
.form-control::placeholder {
  color: #8f9aae;
}
.form-control:focus {
  border-color: rgba(244,63,138,.75);
  box-shadow: 0 0 0 3px rgba(244,63,138,.14);
}
.input-group-addon {
  color: #fff;
  background: #202d45;
  border-color: rgba(255,255,255,.14);
}

/* Buttons — Instagram-inspired gradient */
.btn,
.btn-info,
.btn-primary,
.btn-success,
.btn-warning,
.btn-danger {
  border-radius: 10px;
  border: 0;
  color: #fff !important;
  font-weight: 700;
  background: linear-gradient(100deg, #f58529 0%, #dd2a7b 46%, #8134af 78%, #515bd4 100%);
  box-shadow: 0 8px 20px rgba(221,42,123,.22);
}
.btn:hover,
.btn:focus,
.btn:active {
  color: #fff !important;
  filter: brightness(1.08);
  box-shadow: 0 10px 24px rgba(221,42,123,.30);
}
.btn-outline,
.btn-info.btn-outline,
.btn-primary.btn-outline,
.btn-success.btn-outline,
.btn-warning.btn-outline,
.btn-danger.btn-outline {
  color: #fff;
  border: 1px solid rgba(255,255,255,.24);
  background: rgba(255,255,255,.06);
}
.btn-outline:hover,
.btn-info.btn-outline:hover,
.btn-primary.btn-outline:hover,
.btn-success.btn-outline:hover,
.btn-warning.btn-outline:hover,
.btn-danger.btn-outline:hover {
  background: linear-gradient(100deg, #f58529, #dd2a7b, #8134af);
  color: #fff;
}

/* Alerts / status messages */
.alert {
  border-radius: 12px;
  border-color: var(--iw-border);
}
.alert-success {
  color: #e9fff5;
  background: rgba(16,185,129,.18);
  border-color: rgba(16,185,129,.35);
}
.alert-info {
  color: #eef4ff;
  background: rgba(91,124,250,.18);
  border-color: rgba(91,124,250,.35);
}
.alert-warning {
  color: #fff7e6;
  background: rgba(245,158,11,.17);
  border-color: rgba(245,158,11,.35);
}
.alert-danger {
  color: #fff0f4;
  background: rgba(244,63,138,.17);
  border-color: rgba(244,63,138,.35);
}

/* Tables / list groups */
.table,
.table > thead > tr > th,
.table > tbody > tr > td,
.table > tfoot > tr > td {
  color: var(--iw-text);
  border-color: var(--iw-border);
}
.table-striped > tbody > tr:nth-of-type(odd) {
  background: rgba(255,255,255,.025);
}
.list-group-item {
  color: var(--iw-text);
  background: rgba(23,36,58,.88);
  border-color: var(--iw-border);
}

/* Login page backdrop */
.backcuk {
  background: radial-gradient(circle at 50% 10%, rgba(221,42,123,.25), transparent 30%),
              linear-gradient(135deg, #080c18, #141a2b 55%, #241327) !important;
}
.backcuk .panel {
  max-width: 520px;
  margin-left: auto;
  margin-right: auto;
}

/* Instagram accent utility */
.instagram-accent {
  background: linear-gradient(100deg, #f58529, #dd2a7b, #8134af, #515bd4);
}

/* Mobile navbar */
@media (max-width: 767px) {
  .navbar-default .navbar-nav .open .dropdown-menu > li > a {
    color: #f4f5fa;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #fff;
    background: rgba(244,63,138,.16);
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #fff;
    background: rgba(244,63,138,.22);
  }
}