/* ==========================================================================
   Affiance — warm romantic theme layer
   Loaded last on every page. Restyles existing Bootstrap 3 / vendor plugin
   classes in place — no markup or class names were changed, so xeditable,
   ng-table, bootstrap-tour, bootstrap-toggle, cropit and the datepicker
   keep working exactly as before.
   ========================================================================== */

:root {
  --af-primary: #B15566;
  --af-primary-dark: #8B3F4D;
  --af-primary-light: #F6E4E7;
  --af-accent: #C7973F;
  --af-accent-dark: #A67A2E;
  --af-accent-light: #F6ECD9;
  --af-bg: #FBF6F1;
  --af-surface: #FFFFFF;
  --af-surface-alt: #FDF8F3;
  --af-text: #3D2E2C;
  --af-text-muted: #8C7A75;
  --af-border: #EDE1D8;
  --af-success: #6F9873;
  --af-danger: #B85C52;
  --af-shadow-sm: 0 2px 8px rgba(90, 50, 50, .08);
  --af-shadow: 0 6px 20px rgba(90, 50, 50, .10);
  --af-shadow-lg: 0 16px 40px rgba(90, 50, 50, .16);
  --af-radius: 14px;
  --af-radius-sm: 8px;
  --font-heading: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --font-body: 'Lato', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

/* ---- base ---------------------------------------------------------- */

html, body {
  background-color: var(--af-bg);
  color: var(--af-text);
  font-family: var(--font-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--font-heading);
}

a { color: var(--af-primary); }
a:hover, a:focus { color: var(--af-primary-dark); }

::selection { background: var(--af-primary-light); color: var(--af-primary-dark); }

.blend-gradient {
  background: var(--af-bg);
}

/* ---- buttons --------------------------------------------------------- */

.btn {
  opacity: 1;
  border-width: 1px;
  border-radius: var(--af-radius-sm);
  font-weight: 600;
  letter-spacing: .2px;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
  box-shadow: none;
}
.btn:hover, .btn:focus { opacity: 1; }

.btn-primary {
  background-color: var(--af-primary);
  border-color: var(--af-primary);
  color: #fff;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active,
.btn-primary.active, .open .dropdown-toggle.btn-primary {
  background-color: var(--af-primary-dark);
  border-color: var(--af-primary-dark);
  color: #fff;
}

.btn-default, .footer-btn {
  background-color: var(--af-surface);
  border-color: var(--af-border);
  color: var(--af-text);
}
.btn-default:hover, .btn-default:focus, .btn-default:active,
.footer-btn:hover, .footer-btn:focus,
.open .dropdown-toggle.btn-default {
  background-color: var(--af-primary-light);
  border-color: var(--af-primary);
  color: var(--af-primary-dark);
}

.btn-warning {
  background-color: var(--af-accent);
  border-color: var(--af-accent);
  color: #fff;
}
.btn-warning:hover, .btn-warning:focus, .btn-warning:active,
.btn-warning.active, .open .dropdown-toggle.btn-warning {
  background-color: var(--af-accent-dark);
  border-color: var(--af-accent-dark);
  color: #fff;
}

.btn-danger {
  background-color: var(--af-danger);
  border-color: var(--af-danger);
  color: #fff;
}
.btn-danger:hover, .btn-danger:focus, .btn-danger:active {
  background-color: #99453d;
  border-color: #99453d;
  color: #fff;
}

.btn-success {
  background-color: var(--af-success);
  border-color: var(--af-success);
  color: #fff;
}
.btn-success:hover, .btn-success:focus, .btn-success:active {
  background-color: #587d5c;
  border-color: #587d5c;
  color: #fff;
}

.btn-login {
  background-color: var(--af-primary);
  border-color: var(--af-primary);
  border-radius: var(--af-radius-sm);
}
.btn-login:hover, .btn-login:focus {
  background-color: var(--af-primary-dark);
  border-color: var(--af-primary-dark);
}

.btn-register {
  background-color: var(--af-accent);
  border-color: var(--af-accent);
  border-radius: var(--af-radius-sm);
}
.btn-register:hover, .btn-register:focus {
  background-color: var(--af-accent-dark);
  border-color: var(--af-accent-dark);
}

.forgot-password { color: var(--af-text-muted); }
.forgot-password:hover, .forgot-password:focus { color: var(--af-primary); }

/* ---- forms ------------------------------------------------------------ */

.form-control {
  border: 1px solid var(--af-border);
  border-radius: var(--af-radius-sm);
  box-shadow: none;
  color: var(--af-text);
}
.form-control:focus {
  border-color: var(--af-primary);
  box-shadow: 0 0 0 3px var(--af-primary-light);
}
.input-group-addon {
  background-color: var(--af-surface-alt);
  border: 1px solid var(--af-border);
  border-radius: var(--af-radius-sm);
  color: var(--af-text-muted);
}
.panel-login input[type="text"], .panel-login input[type="email"], .panel-login input[type="password"] {
  border-color: var(--af-border);
}
.panel-login input:hover, .panel-login input:focus { border-color: var(--af-primary); }

/* ---- panels / login ---------------------------------------------------- */

.panel-login {
  border: none;
  border-radius: var(--af-radius);
  box-shadow: var(--af-shadow-lg);
  overflow: hidden;
}
.panel-login > .panel-heading {
  background-color: var(--af-surface);
  border-color: var(--af-surface);
  padding-top: 24px;
}
.panel-login > .panel-heading a {
  color: var(--af-text-muted);
  font-family: var(--font-heading);
}
.panel-login > .panel-heading a.active { color: var(--af-primary); }

/* ---- landing page intro header ---------------------------------------- */

.intro-header {
  background: linear-gradient(rgba(120, 55, 65, .55), rgba(120, 55, 65, .65)), url(../img/intro-bg.jpg) no-repeat center center;
  background-size: cover;
}
.intro-message > h1 {
  font-family: var(--font-heading);
  font-weight: 700;
}
.intro-divider { border-top-color: rgba(255, 255, 255, .5); }
.network-name { font-family: var(--font-body); }
.list-inline.intro-social-buttons > li > a.btn-default {
  background-color: rgba(255, 255, 255, .12);
  border-color: rgba(255, 255, 255, .5);
  color: #fff;
}
.list-inline.intro-social-buttons > li > a.btn-default:hover {
  background-color: #fff;
  color: var(--af-primary-dark);
}

/* ---- dashboard header (budget / contributions / pledges / guestlist) -- */

.dashboard {
  background: linear-gradient(135deg, rgba(120, 55, 65, .78), rgba(150, 105, 70, .62)), url("../img/patch-fabric4.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}
.dashboard__header h1, .dashboard__header h2, .dashboard__header h3, .dashboard__header h4 {
  font-family: var(--font-heading);
}
.top-image {
  box-shadow: var(--af-shadow-lg);
}

/* ---- modals ------------------------------------------------------------ */

.modal-content {
  border: none;
  border-radius: var(--af-radius);
  box-shadow: var(--af-shadow-lg);
  overflow: hidden;
}
.modal-header {
  border-bottom: 1px solid var(--af-border);
}
.modal-footer {
  border-top: 1px solid var(--af-border);
}
.pledge-modal-header {
  background: linear-gradient(135deg, var(--af-primary), var(--af-accent));
  border-bottom: none;
}
.pledge-modal-content {
  border-radius: var(--af-radius) !important;
  overflow: hidden;
}

/* ---- footer nav / dropdowns -------------------------------------------- */

.budget-footer {
  background: var(--af-surface) !important;
  border-top: 1px solid var(--af-border);
  border-top-color: var(--af-border);
  box-shadow: 0 -6px 20px rgba(90, 50, 50, .06);
}
.dropdown-menu {
  border: none;
  border-radius: var(--af-radius-sm);
  box-shadow: var(--af-shadow-lg);
  padding: 6px 0;
  overflow: hidden;
}
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
  background-color: var(--af-primary-light);
  color: var(--af-primary-dark);
}
.dropdown-header {
  color: var(--af-text-muted);
  font-weight: 700;
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: .5px;
}

/* ---- tabs --------------------------------------------------------------- */

.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
  color: var(--af-primary-dark);
  border-color: var(--af-border) var(--af-border) transparent;
  border-top: 2px solid var(--af-primary);
}
.nav-tabs > li > a:hover {
  background-color: var(--af-surface-alt);
  border-color: transparent;
}

/* ---- tables -------------------------------------------------------------- */

.table > thead > tr > th {
  color: var(--af-primary-dark);
  font-weight: 700;
  border-bottom-color: var(--af-border);
}
.table-striped > tbody > tr:nth-child(odd) > td, .table-striped > tbody > tr:nth-child(odd) > th {
  background-color: var(--af-surface-alt);
}
.table-hover > tbody > tr:hover > td, .table-hover > tbody > tr:hover > th {
  background-color: var(--af-primary-light);
}
.table-bordered > thead > tr > th, .table-bordered > thead > tr > td,
.table-bordered > tbody > tr > th, .table-bordered > tbody > tr > td {
  border-bottom-color: var(--af-border);
}
.table-striped.table-mc-light-blue > tbody > tr:nth-child(odd) > td,
.table-striped.table-mc-light-blue > tbody > tr:nth-child(odd) > th {
  background-color: var(--af-surface-alt);
}
.table-hover.table-mc-light-blue > tbody > tr:hover > td,
.table-hover.table-mc-light-blue > tbody > tr:hover > th {
  background-color: var(--af-primary-light);
}
.table > thead > tr.info > th, .table > tbody > tr.info > td,
.table > thead > tr.active > th, .table > tbody > tr.active > td {
  background-color: var(--af-primary-light);
}
.budget-sections h4 { font-family: var(--font-heading); }
.budget-item-name-a { color: var(--af-text); }
.budget-item-name-a:hover { color: var(--af-primary); }

/* ---- progress / labels / alerts ------------------------------------------ */

.progress {
  background-color: var(--af-border);
  border-radius: 20px;
  overflow: hidden;
}
.progress-bar-success { background-color: var(--af-success); }
.progress-bar-warning { background-color: var(--af-accent); }
.progress-bar-danger { background-color: var(--af-danger); }

.label-success { background-color: var(--af-success); }
.label-warning { background-color: var(--af-accent); }
.label-danger { background-color: var(--af-danger); }
.label-default { background-color: var(--af-text-muted); }

.alert-success { background-color: #EAF2EC; border-color: #CFE3D5; color: #3E6A4E; }
.alert-danger { background-color: #FBEAE7; border-color: #F0CFC7; color: #8B3B32; }
.alert-warning { background-color: var(--af-accent-light); border-color: #E9D6A8; color: #7A5C22; }

/* ---- editable-in-place (xeditable) ---------------------------------------- */

.editable-click, a.editable-click {
  color: var(--af-primary);
}
.editable-click:hover, a.editable-click:hover {
  color: var(--af-primary-dark);
  border-bottom-color: var(--af-primary-dark);
}
.popover-wrapper form {
  border-color: var(--af-border);
  border-radius: var(--af-radius-sm);
  box-shadow: var(--af-shadow);
}

/* ---- datepicker (pledge collection date) ----------------------------------- */

.datepicker table tr td.active, .datepicker table tr td.active:hover,
.datepicker table tr td.active.disabled, .datepicker table tr td.active.disabled:hover {
  background-color: var(--af-primary) !important;
  background-image: none !important;
  border-color: var(--af-primary-dark) !important;
}
.datepicker table tr td.today, .datepicker table tr td.today:hover {
  background-color: var(--af-accent-light) !important;
  background-image: none !important;
}
.datepicker table tr td.day:hover, .datepicker table tr td.focused {
  background: var(--af-primary-light) !important;
}
.datepicker .datepicker-switch:hover, .datepicker .next:hover, .datepicker .prev:hover {
  background: var(--af-surface-alt);
}

/* ---- register wizard (gsdk-base) ------------------------------------------- */

.wizard-container a { color: var(--af-primary); }
.wizard-card {
  border-radius: var(--af-radius);
  box-shadow: var(--af-shadow-lg);
}
.wizard-card .wizard-header h3 {
  font-family: var(--font-heading);
  letter-spacing: .5px;
}
.wizard-card .info-text { color: var(--af-text-muted); }
.wizard-card .nav-pills > li > a {
  background-color: var(--af-surface-alt);
  color: var(--af-text-muted) !important;
}
.wizard-card.ct-wizard-orange .nav-pills > li.active a {
  background-color: var(--af-primary);
}
.wizard-card .picture { border-color: var(--af-border); }
.wizard-card .picture:hover, .wizard-card.ct-wizard-orange .picture:hover {
  border-color: var(--af-accent);
}
.wizard-card .choice .icon { border-color: var(--af-border); }
.wizard-card.ct-wizard-orange .choice:hover .icon, .wizard-card.ct-wizard-orange .choice.active .icon {
  border-color: var(--af-accent);
}
.tooltip-inner {
  background-color: var(--af-accent-light);
  color: #6B4E1E;
}
.tooltip.top .tooltip-inner:after { border-top-color: var(--af-accent-light); }
.tooltip.bottom .tooltip-inner:after { border-bottom-color: var(--af-accent-light); }

/* checkbox-style item picker on the register wizard */
.inputGroup label:before { background-color: var(--af-primary); }
.inputGroup label:after { border-color: var(--af-border); }
.inputGroup input:checked ~ label:after { background-color: var(--af-accent); border-color: var(--af-accent); }
.cropit-preview { border-color: var(--af-border); background-color: var(--af-surface-alt); }

/* ---- misc ----------------------------------------------------------------- */

.well { background-color: var(--af-surface-alt); border-color: var(--af-border); }
hr { border-top-color: var(--af-border); }
