/** 
 *------------------------------------------------------------------------------
 * @package       T3 Framework for Joomla!
 *------------------------------------------------------------------------------
 * @copyright     Copyright (C) 2004-2013 JoomlArt.com. All Rights Reserved.
 * @license       GNU General Public License version 2 or later; see LICENSE.txt
 * @authors       JoomlArt, JoomlaBamboo, (contribute to this project at github 
 *                & Google group to become co-author)
 * @Google group: https://groups.google.com/forum/#!forum/t3fw
 * @Link:         http://t3-framework.org 
 *------------------------------------------------------------------------------
 */
 

// --------------------------------------------------
// TYPOGRAPHY
// --------------------------------------------------


// BODY TEXT
// ------------------------------------------------------

// Paragraphs
// ----------
p {
  margin: 0 0 @T3globalMargin / 2;
  small, .small {
    font-size: @T3smallerFontSize;
    color: @grayLight;
  }
}

.lead {
  margin-bottom: @T3globalMargin;
  font-size: 20px;
  font-weight: 200;
  line-height: @baseLineHeight * 1.5;
}


// Emphasis & misc
// ---------------

small {
  font-size: 85%; // Ex: 14px base font * 85% = about 12px
}

strong {
  font-weight: bold;
}

em {
  font-style: italic;
}

cite {
  font-style: normal;
}

.muted {
  color: @grayLight;
}
a.muted:hover,
a.muted:focus        { color: darken(@grayLight, 10%); }

.text-warning        { color: @warningText; }
a.text-warning:hover,
a.text-warning:focus { color: darken(@warningText, 10%); }

.text-error          { color: @errorText; }
a.text-error:hover,
a.text-error:focus   { color: darken(@errorText, 10%); }

.text-info           { color: @infoText; }
a.text-info:hover,
a.text-info:focus    { color: darken(@infoText, 10%); }

.text-success        { color: @successText; }
a.text-success:hover,
a.text-success:focus { color: darken(@successText, 10%); }

.text-left           { text-align: left; }
.text-right          { text-align: right; }
.text-center         { text-align: center; }

.highlight {
  background-color: #FFC;
  font-weight: bold;
  padding: 1px 4px;
}



// HEADINGS
// ------------------------------------------------------

h1, h2, h3, h4, h5, h6 {
  margin: (@T3globalMargin / 2) 0;
  font-family: @headingsFontFamily;
  font-weight: @headingsFontWeight;
  line-height: 1;
  color: @headingsColor;
  text-rendering: optimizelegibility; // Fix the character spacing for headings
  small {
    font-weight: normal;
    line-height: 1;
    color: @grayLight;
  }
}

h1 {
  font-size: @baseFontSize * 2.5;
  line-height: @baseLineHeight * 2;
  small {
    font-size: @baseFontSize * 2;
  }
}

h2 {
  font-size: @baseFontSize * 2; 
  line-height: @baseLineHeight * 2;
  small {
    font-size: @baseFontSize * 1.5;
  }
}

h3 {
  font-size: @baseFontSize * 1.5; 
  line-height: @baseLineHeight * 2; 
  small {
    font-size: @baseFontSize + 2px;
  }
}

h4 {
  font-size: @baseFontSize + 2px; 
  line-height: @baseLineHeight;
  small {
    font-size: @baseFontSize;
  }
}

h5 {
  font-size: @baseFontSize + 1px; 
  line-height: @baseLineHeight; 
  small {
    font-size: @baseFontSize - 2px;
  }
}

h6 {
  font-size: @baseFontSize; 
  line-height: @baseLineHeight; 
}



// TITLES
// ------------------------------------------------------

// Page header
// -----------
.page-header {
  border-bottom: 1px solid @T3borderColor;
  padding-bottom: @T3globalPadding;
  margin: 0 0 (@T3globalMargin * 2);
}

.page-title,
.page-header h1 {
  line-height: 1;
  margin: 0;
}


// Page Subheader
// --------------
.page-subheader {
  border-bottom: 1px solid @T3borderColor;
  margin: 0 0 @T3globalMargin;
  .clearfix();
}

.page-subtitle,
.page-subheader h2 {
  line-height: 1;
  margin: 0;
}

.page-header + .page-subheader {
  margin-top: -@T3globalMargin; //If there is page header, then omit the space before page subheader
}


// Article Header
// --------------
.article-header {
}

.article-title,
.article-header h1, {
  margin: 0 0 @T3globalMargin/2 0;
  line-height: 1;
}

// Smaller "Article Title" in Blog and List layout
h2.article-title,
.article-header h2 {
}


// Item Header
// -----------
.item-title {
  font-weight: bold;
}



// LISTS
// ------------------------------------------------------

// Unordered and Ordered lists
// ---------------------------
ul, ol {
  padding: 0;
  margin: 0 0 @T3globalMargin / 2 25px;
}

ul ul,
ul ol,
ol ol,
ol ul {
  margin-bottom: 0;
}

ul {
  list-style: disc;
}

ol {
  list-style: decimal;
}

li {
  line-height: @baseLineHeight;
}

// Remove default list styles
ul.unstyled,
ol.unstyled {
  margin-left: 0;
  list-style: none;
}

// Single-line list items
ul.inline,
ol.inline {
  margin-left: 0;
  list-style: none;
  > li {
    display: inline-block;
    .ie7-inline-block();
    padding-left: 5px;
    padding-right: 5px;
  }
}

// Description Lists
// -----------------
dl {
  margin-bottom: @baseLineHeight;
}

dt,
dd {
  line-height: @baseLineHeight;
}

dt {
  font-weight: bold;
}

dd {
  margin-left: @T3globalMargin / 2;
}

// Horizontal layout (like forms)
.dl-horizontal {
  .clearfix(); // Ensure dl clears floats if empty dd elements present
  dt {
    float: left;
    width: @horizontalComponentOffset - 20;
    clear: left;
    text-align: right;
    .text-overflow();
  }
  dd {
    margin-left: @horizontalComponentOffset;
  }
}




// LABELS & BADGES
// --------------------------------------------------

// Base classes
.label,
.badge {
  display: inline-block;
  padding: 2px 4px;
  font-size: @baseFontSize * .846;
  font-weight: bold;
  line-height: 14px; // ensure proper line-height if floated
  color: @white;
  vertical-align: baseline;
  white-space: nowrap;
  text-shadow: 0 -1px 0 rgba(0,0,0,.25);
  background-color: @grayLight;
}

// Set unique padding and border-radius
.label {
  .border-radius(@baseBorderRadius);
}

.badge {
  padding-left: 9px;
  padding-right: 9px;
  .border-radius(@baseBorderRadius);
}

// Empty labels/badges collapse
.label,
.badge {
  &:empty {
    display: none;
  }
}

// Hover/focus state, but only for links
a {
  &.label:hover,
  &.label:focus,
  &.badge:hover,
  &.badge:focus {
    color: @white;
    text-decoration: none;
    cursor: pointer;
  }
}

// Colors
// Only give background-color difference to links (and to simplify, we don't qualifty with `a` but [href] attribute)
.label,
.badge {
  // Important (red)
  &-important         { background-color: @errorText; }
  &-important[href]   { background-color: darken(@errorText, 10%); }
  // Warnings (orange)
  &-warning           { background-color: @orange; }
  &-warning[href]     { background-color: darken(@orange, 10%); }
  // Success (green)
  &-success           { background-color: @successText; }
  &-success[href]     { background-color: darken(@successText, 10%); }
  // Info (turquoise)
  &-info              { background-color: @infoText; }
  &-info[href]        { background-color: darken(@infoText, 10%); }
  // Inverse (black)
  &-inverse           { background-color: @grayDark; }
  &-inverse[href]     { background-color: darken(@grayDark, 10%); }
}

// Quick fix for labels/badges in buttons
.btn {
  .label,
  .badge {
    position: relative;
    top: -1px;
  }
}

.btn-mini {
  .label,
  .badge {
    top: 0;
  }
}

// Quick fix for labels/badges in page-header- NNTH
.page-header {
  .label,
  .badge {
    vertical-align: middle;
  }
}



// MISC
// ------------------------------------------------------

// Abbreviations and acronyms
abbr[title],
// Added data-* attribute to help out our tooltip plugin, per https://github.com/twitter/bootstrap/issues/5257
abbr[data-original-title] {
  cursor: help;
  border-bottom: 1px dotted @grayLight;
}

abbr.initialism {
  font-size: 90%;
  text-transform: uppercase;
}


// Blockquotes
// -----------
blockquote {
  padding: 0 0 0 15px;
  margin: 0 0 @T3globalMargin;
  border-left: 5px solid @grayLighter;
  p {
    margin-bottom: 0;
    font-size: @baseFontSize * 1.25;
    font-weight: 300;
    line-height: 1.25;
  }
  small {
    display: block;
    line-height: @baseLineHeight;
    color: @grayLight;
    &:before {
      content: '\2014 \00A0';
    }
  }

  // Float right with text-align: right
  &.pull-right {
    float: right;
    padding-right: 15px;
    padding-left: 0;
    border-right: 5px solid @grayLighter;
    border-left: 0;
    p,
    small {
      text-align: right;
    }
    small {
      &:before {
        content: '';
      }
      &:after {
        content: '\00A0 \2014';
      }
    }
  }
}


// Quotes
// ------
q:before,
q:after,
blockquote:before,
blockquote:after {
  content: "";
}


// Addresses
// ---------
address {
  display: block;
  margin-bottom: 0;
  font-style: normal;
  line-height: @baseLineHeight;
}