/* general */
html {font-size: 100%; /* IE hack */ }
body {font: normal 0.95em Arial, sans-serif; margin: 0; direction: rtl}
table {font-size: 100%; /* IE hack */ width: 100%}
form {margin: 0}
img {border: none; vertical-align: bottom}
th {text-align: right; background: #FFDDBC; padding: 2px 5px; font-weight: bold;}
ul {list-style-image: url('../images/bullet.gif'); padding: 0; margin: 5px 15px}
li {margin: 2px 0}
h1 {display: block}
h2 {color: #704A7C; font: normal 1.2em Arial, sans-serif; margin: 0}
h3 {color: #704A7C; font: bold 1em Arial, sans-serif; margin: 0; }
h3 em {font: bold 0.8em Arial, sans-serif; color: black}
a {color: #1770B0}
a:hover {color: #F58B21}
.free {width: auto}
.readonly {color: gray;}
.adder {text-decoration: none; text-align: center; font-weight: bolder; font-size: 150%; color: green; padding: 0 10px;}
.remover {color: red;}
.report {font-size:12px}
.report .button {width:auto;padding: 0 4px;}

.intro {padding: 2px 6px;}
#entrance input[name="login"], #entrance input[name="password"] {width: 200px; font-size: 150%;}
#entrance input[type="submit"] {font-size: 150%; text-transform: capitalize;}

/* header & tabs */
.logo {padding: 0 5px; width: 45%}
.menu {vertical-align: top}
.vetter {padding: 10px 15px; direction: ltr}

.tabs {list-style-type: none; list-style-image: none; margin: 0; padding: 0}
.tabs li {float: right; margin: 0 20px 0 0; padding: 1px 10px 0 10px; border-radius: 5px 5px 0 0; position: relative;}
.tabs li[selected] {padding: 1px 13px 0 13px; font-weight: bold; border-left: 1px solid #704A7C; border-top:1px solid #704A7C; border-right:1px solid #704A7C; background-color: palegoldenrod;}
.tabs a {text-decoration: none;}
.tabs a[disabled] {color:grey;}

.line {border-bottom: 1px solid #704A7C; clear: both}

/* main */
.main {background: #FAEAFF; border-bottom: 1px solid #704A7C} /* TODO: this should be added to main.main */
main.main {padding: 2%;}
.main td {padding: 2px 5px;} /* TODO: this can be deleted */

.big {padding: 20px}
h3 a {font: normal 0.9em Arial, sans-serif}
.box {background: white; border: 1px solid #704A7C}
.box p.owner{padding:0;margin:0;font-size:80%;}
a.button, input.button {display: inline-block; padding: 1px 15px; background-color: wheat; border: 2px solid #1770B0; border-radius: 2px; text-align: center; text-decoration: none; font-weight: bold; cursor: pointer; text-transform: capitalize;}
a.next {display: block; padding: 2px; text-align: center; text-decoration: none; text-transform: capitalize;}
.zebra {background-color: #c0c0c0}
.hover:hover{ background-color: #ffb56c !important; }
.treat {font-weight: bold;}
.notes {width: 60%}
.price {width: 60px; direction: ltr; text-align:right;}

.hour_dropdown {width:50px;}

details summary {color: #704A7C; font: bold 1em Arial, sans-serif; margin: 0; cursor: pointer;}
details summary:hover {color: orange;} 
.actions-line {margin: 10px; display: flex; justify-content: space-around; width: 90%;}

.pet-image {float:left; height:60px;}

/* forms */
.checkbox {width: 20px !important;}
select {width: 124px; border-style: none; border: 1px solid #7F9DB9}
input {width: 120px; border-style: none; border: 1px solid #7F9DB9}
input[readonly] {background-color: lightgray;}
input:hover, input:active, input:focus {background-color: lightyellow;}
input[type="checkbox"] {width:20px;}
textarea {font: normal 0.9em Arial, sans-serif; width: 99px; border-style: none; border: 1px solid #7F9DB9}
.datepicker img {width: 17px; height: 20px; margin: 0 2px;}
.date {width: 80px; padding: 0 2px;}
.double {width: 200px}
.small {width: 40px}
.max {width: 97%}
.half {width: 48.1%}
.data {font-weight: bold; padding-left: 30px}
.check input {border: none}
.hah {border: 1px solid #7F9DB9 !important}

/* init */
#pet_edit {display: none; font: normal 0.82em Arial, sans-serif}
#client_edit {display: none; font: normal 0.82em Arial, sans-serif} 
#week {display: none}
#message, #day {width: 205px}

/* calendar */
#EndTitle {text-align: center}
.dates_container {direction: rtl; border: 1px solid #704A7C}
.orange_blue {background: #FFDDBC; border-bottom: 1px solid #704A7C; padding: 1px 3px}
.over {cursor: pointer; background: #FFDDBC}

/* patch for Mozilla
ul {margin: 0; padding: 0} */

.dialog {background-color: white;border: 1px solid blue;display: none;position: absolute;}
.non_active{text-decoration: line-through;}

/* datatable */
/* div.box table input {width:160px;margin:2px;} */
.preftable {margin-bottom: 30px;}
.preftable tr:hover {background-color: #ccc;}
.preftable input, .preftable select {width: 65%; margin: 2px;}

.report-table {border-collapse: collapse; color: #444;}
.report-table tr:hover { background-color: #ffb56c !important; }
.report-table td {padding: 5px;}
.report-table a:focus {color: black; font-weight: bolder;}
.report-table input {width: auto; min-width: 93px;}
.report-table input[type="checkbox"] {min-width: 20px;}

.show-hide {cursor: pointer;}

#undone_repeated_reminders_div table {color: red;}
#undone_repeated_reminders_div table td {padding: 5px;}
#recently_done_repeated_reminders_div table tr:hover, #undone_repeated_reminders_div table tr:hover {background-color: #ffb56c !important;}
#undone_repeated_reminders_div li {margin-top: 4px; }

/* colors */
.c-routine {color: green;} 
.c-exams {color: green;}
.c-avchana {color: green;}
.c-medical {color: green;}
.c-chirurgic {color: green;}
.c-labexams {color: green;}
.c-tfasim {color: black;}
.c-products {color: green;}
.c-remarks {color: black;}
.c-training {color: blue;} 
.c-maintenance {color: black;}
.c-operational {color: red;}
.c-other {color: black;}

.tresults {font-size: 90%;}
.tresults thead th {padding: 5px; font-size: 95%;}
.tresults tbody tr:hover {background-color: #ccc;}
.tresults tr:nth-child(even) {background-color: #f2f2f2;}

.page-break {page-break-after: always;}

.warning {border: 1px solid #444; background-color: lightsalmon; text-align: center; padding: 1%; width: 80%; margin: 0 auto; border-radius: 5px;}

#errorMissing {text-transform: capitalize;}
#total_price {border: 1px solid black; font-size: 130%; padding: 10px; margin: 10px; background-color: white;}

footer {text-align: center; margin: 40px; font-size: 90%;}