/*
    Document   : villa
    Created on : 13 févr. 2015,
    Author     : A Ferrand

    Couleurs de bases :
        - noir          : #222222,
        - gris foncé    : #3D3D3D,
        - gris          : #838383
        - gris clair    : #BDBDBD,

        - gris très cla : #D3D3D3,
        - blanc-gris    : #EDEDED,
        - blanc-gris    : #F7F7F7,

        - rouge très cla: #FF5243
        - rouge + clair : #FD3A29,
        - rouge clair   : #F03727,
        - rouge         : #D63123,
        - rouge foncé   : #B0281D,
        - rouge très fo : #701A12,

        - vert + clair  : #00D55E,
        - vert clair    : #009642,
        - vert          : #00893C,
        - vert foncé    : #006F31,
        - vert très fonc: #004920,
        
*/

html, body {
    font-family : Calibri,Arial,sans-serif;
    color       : #000000;
    font-size   : 13pt;
    line-height : 20px;
    text-align  : center;
    background  : none repeat scroll 0 0 #EDEDED;
    top         : 0px;
    margin      : 0px;
    padding     : 0px;
    height      : 100%;
    border      : none;
    border-style: none;
}

#content,
#wrapper {
    min-height: 100%;
    position: relative;
    width: 100%;
    min-width:920px;
}

/* ==== general ==== */

.ui-widget, .ui-widget .ui-widget,
.ui-state-highlight p, .ui-state-error p, .ui-state-default p {
    font-family : Calibri,Arial,sans-serif;
    font-size   : 13pt;
}

.h4, h4 {
    font-size: 16pt;
    color: #3d3d3d;
}
.h5, h5 {
    font-size: 15pt;
    color: #3d3d3d;
}

label {
    display  : inline-block;
}

input, textarea, select {
    background-color: #EDEDED;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="search"],
input[type="url"], 
input[type="password"],
.ui-autocomplete-input,
textarea,
.uneditable-input {
    font-size   : 13pt;
    padding: 6px;
}

.font-small {
    font-size: 11pt;
}

/* ==== Boites de dialogues ==== */
.ui-dialog {
    background-color: #FFFFFF;
    box-shadow      : 0 2px 4px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
    border-radius: 2px;
    display: inline-block;
    width:auto;
    min-width:160px;
    padding:0px;
    position:relative;
    text-align: left;
    vertical-align: top;
}
.ui-dialog .ui-dialog-content {
    padding:10px 20px 10px 20px;
}
.ui-dialog .ui-dialog-grey {
    background-color: #EDEDED;
}
.ui-dialog .ui-corner-all {
    border-radius: 2px;
}
.dialog {
    background-color: #FFFFFF;
    box-shadow      : 0 2px 4px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
    border-radius: 2px;
    display: inline-block;
    width:auto;
    min-width:160px;
    padding:40px 20px 10px 20px;
    position:relative;
    text-align: left;
    vertical-align: top;
}

.dialog.lg { min-width: 680px;}
.dialog.md { min-width: 360px;}
.dialog.sm { min-width: 280px;}

.dialog.sm input,
.dialog.md input {
    width: 220px;
    margin-bottom: 8px;
}

.dialog.sm a,
.dialog.md a {
    color: #838383;
    font-style: italic;
    cursor: pointer;
}

.avertDialog .ui-widget-header,
.errorDialog .ui-widget-header {
    background-color: #838383;
    color:white;
}
.ui-dialog-titlebar,
.dialog > .title {
    top:0px;
    right:0px;
    background-color: #838383;
    color:white;
    text-align: left;
    position:absolute;
    width:100%;
    padding:5px 15px 5px 15px;
}
.ui-dialog .ui-dialog-title {
    color:white;
    font-weight: normal;
}
.dialog > .title.tick {
    background-color: #838383;
    background-image:url('../images/tick.png');
    background-repeat:no-repeat;
    background-position:90% center;
}
.ui-dialog .ui-dialog-titlebar-close {
    background-color: #F7F7F7;
    opacity:0.75;
}

.ui-dialog-buttonpane,
.dialog > .footer {
    text-align: center;
    padding:10px 0px 10px 0px;
}

.ui-dialog-buttonpane button,
.dialog > .footer button {
    font-weight: bold;
    padding-left: 20px;
    padding-right: 20px;
}

.ui-dialog-buttonpane .ui-dialog-buttonset .ui-button:first-child {
    color: #FFFFFF;
    background-color: #D63123;
    border-color: #B0281D;
}
.ui-dialog-buttonpane .ui-dialog-buttonset .ui-button:first-child:hover,
.ui-dialog-buttonpane .ui-dialog-buttonset .ui-button:first-child:focus {
    color: #FFFFFF;
    background-color: #F03727;
    border-color: #D63123;
}

.ui-dialog label,
.dialog label {
    min-width: 150px;
}

.ui-dialog .lbl200 label,
.dialog .lbl200 label {
    min-width: 200px;
}

.ui-dialog label.ui-button,
.dialog label.ui-button {
    min-width: 0px;
}

.ui-dialog form > div,
.ui-dialog form > section > div {
    padding-bottom: 16px;
}

/* ==== bouton par défaut ==== */ 
.ui-button.ui-button-primary {
    color: #FFFFFF;
    background-color: #D63123;
    border-color: #B0281D;
}
.ui-button.ui-button-primary:hover,
.ui-button.ui-button-primary:focus {
    color: #FFFFFF;
    background-color: #F03727;
    border-color: #D63123;
}

.btn.active, .btn:active {
    color:#BDBDBD;
    background-color: #3D3D3D;
}

/* ==== menu du haut de page ==== */
.navbar {
    margin-bottom: 0px;
    border-radius: 0px;
}

.navbar-right {
    margin-right: 0px;
}

.icon-menu {
    display : inline-block;
    margin  : 0px;
    padding : 0px;
    border  : none;
    border-style: none;
    vertical-align: middle;
    height  : 24px;
    width   : 24px;
    background-attachment: scroll;
    background-repeat: no-repeat;
    background-position: 0px 0px;
}

.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
    background-color: #BDBDBD;
}


/* ==== ICONES ==== */

.icon-size-64 { font-size: 64px; }
.icon-size-40 { font-size: 40px; }
.icon-size-32 { font-size: 32px; }
.icon-size-24 { font-size: 24px; }
.icon-size-16 { font-size: 16px; }

[class^="icon-"], [class*=" icon-"] {
    display: inline-block;
    padding-bottom: 0.15em;
    vertical-align: middle;
}

.icon-v-center {
    padding-bottom: 0px;
    margin-top:-0.15em;
    margin-bottom:-0.15em;
}

/* ==== fieldset par défaut ==== */

fieldset {
    padding : 0.35em 0.625em 0.75em;
}

fieldset label {
    display     : inline-block;
    margin      : 0px 10px 20px 0px;
    width       : 200px;
    text-align  : right;
    border      : none;
    border-style: none;
    vertical-align: top;
}
fieldset label.free-width {
    width:auto;
}

fieldset label.small-width {
    width:100px;
}

fieldset label.all-width {
    text-align:left;
    width:auto;
}

fieldset label .text-muted {
    font-weight: normal;
    text-align : left;
}

/* ==== Collapsible fieldset ==== */

fieldset.collapsible > legend,
.row fieldset.collapsible > legend {   /* we need both standard and new-form here */
    cursor: pointer;
    display: inherit !important;    /* always visible, even when fieldset is collapsed */
}
fieldset.collapsible.collapsed {
    background: none;
    border-radius: 0;
    padding-bottom: 0;
    padding-top: 0;
}
fieldset.collapsible legend i,
fieldset fieldset.collapsible legend i{
    margin-right: 8px;
}
fieldset.collapsible.collapsed > * {
    display: none;
}
fieldset.collapsible.collapsed > legend {
    display: inherit;
}


/* ==== badges (ntifications) avec les couleurs bootstrap ====*/

.badge-pill {
    position: absolute;
    top: 0px;
    right:0px;
    border:none;
}

.badge-pill > .badge {
    display: block;
    margin:4px;
    text-align: left;
}

/*.badge-blue {
    background-image: linear-gradient(to bottom, #5bc0de 0px, #2aabd2 100%);
    background-repeat: repeat-x;
    border-color: #28a4c9;
    color: white;
}
.badge-orange {
    background-image: linear-gradient(to bottom, #f0ad4e 0px, #eb9316 100%);
    background-repeat: repeat-x;
    border-color: #e38d13;
    color: white;
}*/
.badge-red {
    background-image: linear-gradient(to bottom, #FD3A29 0px, #D63123 100%);
    background-repeat: repeat-x;
    border-color: #b92c28;
    color: white;
}


/* ==== Tableau : lignes alternées ==== */

table.full-width {
    width:100%;
    display: inline-table;
}
table.list tbody tr {
    border-bottom: 1px solid #BDBDBD;
}
table.list thead {
    background-color : #838383;
    color: #FFFFFF;
    vertical-align: middle;
}
table.list thead td {
    padding: 4px;
    min-height: 30px;
    font-weight: bold;
}
table.list tbody td {
    padding: 4px;
    min-height: 40px;
}
table.striped tbody tr:nth-child(2n+1) td,
table tbody tr.ui-widget-content.striped td {
    background-color: #F7F7F7;
}

table.clickableRow tbody tr {
    cursor: pointer;
}

table.clickableRow tbody tr:hover td,
table tbody tr.ui-widget-content.clickableRow:hover td {
    background-color: #D3D3D3;
}


/* ==== Grille : jqgrid ==== */
.ui-jqgrid table tbody tr.jqgrow.ui-state-highlight td {
    color: white;
    font-weight: bold !important;
    background-color: #BDBDBD;
    border-color: white;
}

.ui-jqgrid .ui-jqgrid-view {
    font-size: inherit;
}

.ui-jqgrid table {
    border-collapse: separate;
}

/* ==== bootstrap checkbox ===*/
span.checkbox-inline {
    padding-left: 0px;
}

span.checkbox-inline label {
    width         :auto;
    vertical-align: middle;
    margin        : 0;
}

span.radio-btn,
div.radio-btn {
    display       : inline-block;
    vertical-align: middle;
    white-space   : nowrap;
}

span.radio-btn label,
div.radio-btn label {
    width         : auto;
    vertical-align: middle;
    margin        : 0 -0.4em 0 0;
}

/* ==== Plages horaires ==== */

.callableTimeSlot,
td.timeslot.callableTimeSlot {
    background: #00D55E;
}

.uncallableTimeSlot,
td.timeslot.uncallableTimeSlot {
    background: #F03727;
}

.tdTimeslotDay{
    padding-left: 4px;
    padding-right: 4px;
}
.tdTimeslotDay:hover{
    background: #EDEDED;
}

#schedule-listtime {
    min-width: 720px;
    text-align: left;
}

div.ui-dialog {
    z-index: 100;
}

/* ==== Validation ==== */
.validation-advice {
    color: #B0281D;
    display: inline-block;
    padding: 4px;
}

.select2-chosen img {
    max-width: 22px;
    max-height: 22px;
}

.ui-jqgrid input.ui-pg-input {
    height: inherit;
    font-size: inherit;
    padding: inherit;
}

div.updwn {
    width: 40px;
    display: inline-block;
}

div.updwn span {
    cursor: pointer;
}

tbody tr:first-child td div.updwn span:first-child, tbody tr:last-child td div.updwn span:last-child {
    color: lightgray;
    cursor: not-allowed;
}

.moveHandler {
    background: url('../images/move-handle.png') no-repeat center left ;
}