/* Minification failed. Returning unminified contents. (1143,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1144,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1145,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1146,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1147,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1148,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1149,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1150,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1151,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1153,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1154,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1155,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1156,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1157,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1158,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1160,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1161,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1162,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1163,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1164,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1166,20): run-time error CSS1039: Token not allowed after unary operator: '-gb-bg' (1172,60): run-time error CSS1039: Token not allowed after unary operator: '-ps-th' (1173,20): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1177,96): run-time error CSS1039: Token not allowed after unary operator: '-ps-sw' (1201,44): run-time error CSS1039: Token not allowed after unary operator: '-gb-teal' (1201,60): run-time error CSS1039: Token not allowed after unary operator: '-gb-green' (1202,51): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1208,59): run-time error CSS1039: Token not allowed after unary operator: '-gb-shadow-lg' (1217,70): run-time error CSS1039: Token not allowed after unary operator: '-ink' (1220,59): run-time error CSS1039: Token not allowed after unary operator: '-hover' (1220,80): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1224,30): run-time error CSS1039: Token not allowed after unary operator: '-ps-th' (1224,71): run-time error CSS1039: Token not allowed after unary operator: '-ps-sw' (1225,20): run-time error CSS1039: Token not allowed after unary operator: '-surface' (1225,60): run-time error CSS1039: Token not allowed after unary operator: '-line' (1231,15): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1235,15): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1239,66): run-time error CSS1039: Token not allowed after unary operator: '-hover' (1239,87): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1242,15): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1246,48): run-time error CSS1039: Token not allowed after unary operator: '-gb-teal' (1250,44): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1250,60): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy-light' (1251,23): run-time error CSS1039: Token not allowed after unary operator: '-gb-radius' (1256,61): run-time error CSS1039: Token not allowed after unary operator: '-gb-cta' (1256,83): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1267,46): run-time error CSS1039: Token not allowed after unary operator: '-ps-sw' (1271,91): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1272,50): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1274,60): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1278,52): run-time error CSS1039: Token not allowed after unary operator: '-ps-sw' (1290,53): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1299,20): run-time error CSS1039: Token not allowed after unary operator: '-surface' (1299,54): run-time error CSS1039: Token not allowed after unary operator: '-line-soft' (1300,23): run-time error CSS1039: Token not allowed after unary operator: '-gb-radius' (1300,53): run-time error CSS1039: Token not allowed after unary operator: '-gb-shadow' (1312,15): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1320,20): run-time error CSS1039: Token not allowed after unary operator: '-gb-cta' (1320,42): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1326,20): run-time error CSS1039: Token not allowed after unary operator: '-surface' (1326,43): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1326,77): run-time error CSS1039: Token not allowed after unary operator: '-line' (1328,75): run-time error CSS1039: Token not allowed after unary operator: '-hover' (1334,20): run-time error CSS1039: Token not allowed after unary operator: '-line-soft' (1338,15): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1340,44): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1341,65): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1353,50): run-time error CSS1039: Token not allowed after unary operator: '-surface' (1353,73): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1354,26): run-time error CSS1039: Token not allowed after unary operator: '-line-soft' (1354,59): run-time error CSS1039: Token not allowed after unary operator: '-gb-radius' (1354,89): run-time error CSS1039: Token not allowed after unary operator: '-gb-shadow' (1359,20): run-time error CSS1039: Token not allowed after unary operator: '-surface' (1359,77): run-time error CSS1039: Token not allowed after unary operator: '-gb-shadow-lg' (1359,112): run-time error CSS1039: Token not allowed after unary operator: '-gb-teal' (1369,20): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1369,63): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1372,48): run-time error CSS1039: Token not allowed after unary operator: '-line-soft' (1372,73): run-time error CSS1039: Token not allowed after unary operator: '-ink' (1373,55): run-time error CSS1039: Token not allowed after unary operator: '-hover' (1378,21): run-time error CSS1039: Token not allowed after unary operator: '-ps-sw' (1378,62): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1394,107): run-time error CSS1039: Token not allowed after unary operator: '-gb-shadow-lg' (1411,61): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1414,15): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1428,110): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1432,95): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1433,99): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1436,59): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1441,34): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1442,20): run-time error CSS1039: Token not allowed after unary operator: '-surface' (1442,54): run-time error CSS1039: Token not allowed after unary operator: '-line-soft' (1442,87): run-time error CSS1039: Token not allowed after unary operator: '-gb-radius' (1443,20): run-time error CSS1039: Token not allowed after unary operator: '-gb-shadow' (1451,20): run-time error CSS1039: Token not allowed after unary operator: '-surface' (1451,55): run-time error CSS1039: Token not allowed after unary operator: '-line' (1451,83): run-time error CSS1039: Token not allowed after unary operator: '-gb-radius' (1452,35): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1456,106): run-time error CSS1039: Token not allowed after unary operator: '-gb-teal' (1457,75): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1459,47): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1465,20): run-time error CSS1039: Token not allowed after unary operator: '-surface' (1465,43): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1465,77): run-time error CSS1039: Token not allowed after unary operator: '-line' (1468,62): run-time error CSS1039: Token not allowed after unary operator: '-hover' (1468,90): run-time error CSS1039: Token not allowed after unary operator: '-gb-teal' (1470,20): run-time error CSS1039: Token not allowed after unary operator: '-gb-cta' (1470,42): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1476,20): run-time error CSS1039: Token not allowed after unary operator: '-surface' (1476,43): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1476,77): run-time error CSS1039: Token not allowed after unary operator: '-line' (1478,74): run-time error CSS1039: Token not allowed after unary operator: '-hover' (1478,102): run-time error CSS1039: Token not allowed after unary operator: '-gb-teal' (1479,58): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1480,46): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1485,20): run-time error CSS1039: Token not allowed after unary operator: '-surface' (1485,86): run-time error CSS1039: Token not allowed after unary operator: '-gb-red' (1486,41): run-time error CSS1039: Token not allowed after unary operator: '-gb-shadow' (1494,78): run-time error CSS1039: Token not allowed after unary operator: '-gb-red' (1497,65): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1498,66): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1499,111): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1500,49): run-time error CSS1039: Token not allowed after unary operator: '-gb-red' (1502,80): run-time error CSS1039: Token not allowed after unary operator: '-line' (1506,102): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1508,84): run-time error CSS1039: Token not allowed after unary operator: '-gb-red' (1512,44): run-time error CSS1039: Token not allowed after unary operator: '-line' (1513,52): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1515,117): run-time error CSS1039: Token not allowed after unary operator: '-gb-red' (1516,59): run-time error CSS1039: Token not allowed after unary operator: '-gb-red' (1517,53): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1525,15): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1535,44): run-time error CSS1039: Token not allowed after unary operator: '-ink' (1536,44): run-time error CSS1039: Token not allowed after unary operator: '-line' (1540,22): run-time error CSS1039: Token not allowed after unary operator: '-gb-teal' (1549,26): run-time error CSS1039: Token not allowed after unary operator: '-line' (1554,44): run-time error CSS1039: Token not allowed after unary operator: '-ink' (1561,30): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1570,26): run-time error CSS1039: Token not allowed after unary operator: '-line' (1576,44): run-time error CSS1039: Token not allowed after unary operator: '-ink' (1579,89): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1586,22): run-time error CSS1039: Token not allowed after unary operator: '-gb-red' (1593,29): run-time error CSS1039: Token not allowed after unary operator: '-line-2' (1594,82): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1597,68): run-time error CSS1039: Token not allowed after unary operator: '-gb-teal' (1611,44): run-time error CSS1039: Token not allowed after unary operator: '-line' (1616,33): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1620,65): run-time error CSS1039: Token not allowed after unary operator: '-line' (1623,128): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1624,88): run-time error CSS1039: Token not allowed after unary operator: '-gb-teal' (1624,116): run-time error CSS1039: Token not allowed after unary operator: '-hover' (1625,102): run-time error CSS1039: Token not allowed after unary operator: '-gb-red' (1626,100): run-time error CSS1039: Token not allowed after unary operator: '-gb-red' (1642,20): run-time error CSS1039: Token not allowed after unary operator: '-gb-cta' (1642,42): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1652,67): run-time error CSS1039: Token not allowed after unary operator: '-line-soft' (1654,69): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1655,72): run-time error CSS1039: Token not allowed after unary operator: '-gb-red' (1661,20): run-time error CSS1039: Token not allowed after unary operator: '-surface' (1661,54): run-time error CSS1039: Token not allowed after unary operator: '-line-soft' (1662,27): run-time error CSS1039: Token not allowed after unary operator: '-gb-radius' (1662,44): run-time error CSS1039: Token not allowed after unary operator: '-gb-radius' (1663,20): run-time error CSS1039: Token not allowed after unary operator: '-gb-shadow' (1663,98): run-time error CSS1039: Token not allowed after unary operator: '-ink' (1666,68): run-time error CSS1039: Token not allowed after unary operator: '-ink' (1667,144): run-time error CSS1039: Token not allowed after unary operator: '-gb-teal' (1669,124): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1677,20): run-time error CSS1039: Token not allowed after unary operator: '-surface' (1677,54): run-time error CSS1039: Token not allowed after unary operator: '-line-soft' (1678,23): run-time error CSS1039: Token not allowed after unary operator: '-gb-radius' (1678,53): run-time error CSS1039: Token not allowed after unary operator: '-gb-shadow' (1684,44): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1705,41): run-time error CSS1039: Token not allowed after unary operator: '-line' (1710,126): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1710,167): run-time error CSS1039: Token not allowed after unary operator: '-line' (1711,77): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1720,44): run-time error CSS1039: Token not allowed after unary operator: '-line' (1720,80): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1721,23): run-time error CSS1039: Token not allowed after unary operator: '-gb-radius' (1721,53): run-time error CSS1039: Token not allowed after unary operator: '-gb-shadow-lg' (1723,15): run-time error CSS1039: Token not allowed after unary operator: '-ink' (1731,67): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1734,49): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1741,75): run-time error CSS1039: Token not allowed after unary operator: '-ink' (1744,163): run-time error CSS1062: Expected semicolon or closing curly-brace, found '=' (1746,74): run-time error CSS1039: Token not allowed after unary operator: '-gb-red' (1747,161): run-time error CSS1062: Expected semicolon or closing curly-brace, found '=' (1750,163): run-time error CSS1062: Expected semicolon or closing curly-brace, found '=' (1752,73): run-time error CSS1039: Token not allowed after unary operator: '-gb-teal' (1753,160): run-time error CSS1062: Expected semicolon or closing curly-brace, found '=' (1755,147): run-time error CSS1039: Token not allowed after unary operator: '-line' (1756,141): run-time error CSS1039: Token not allowed after unary operator: '-line' (1756,178): run-time error CSS1039: Token not allowed after unary operator: '-line' (1759,117): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1770,44): run-time error CSS1039: Token not allowed after unary operator: '-surface' (1770,78): run-time error CSS1039: Token not allowed after unary operator: '-line-soft' (1770,111): run-time error CSS1039: Token not allowed after unary operator: '-gb-radius' (1770,141): run-time error CSS1039: Token not allowed after unary operator: '-gb-shadow' (1771,161): run-time error CSS1039: Token not allowed after unary operator: '-line-soft' (1772,82): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1773,72): run-time error CSS1039: Token not allowed after unary operator: '-gb-teal' (1784,81): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1785,64): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1790,20): run-time error CSS1039: Token not allowed after unary operator: '-surface' (1790,54): run-time error CSS1039: Token not allowed after unary operator: '-line-soft' (1790,87): run-time error CSS1039: Token not allowed after unary operator: '-gb-radius' (1791,20): run-time error CSS1039: Token not allowed after unary operator: '-gb-shadow' (1800,51): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1829,31): run-time error CSS1039: Token not allowed after unary operator: '-gb-red' (1832,80): run-time error CSS1039: Token not allowed after unary operator: '-gb-red' (1841,44): run-time error CSS1039: Token not allowed after unary operator: '-gb-red' (1862,20): run-time error CSS1039: Token not allowed after unary operator: '-surface' (1862,54): run-time error CSS1039: Token not allowed after unary operator: '-line-soft' (1862,87): run-time error CSS1039: Token not allowed after unary operator: '-gb-radius' (1863,20): run-time error CSS1039: Token not allowed after unary operator: '-gb-shadow' (1865,108): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1868,120): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1882,30): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1887,53): run-time error CSS1039: Token not allowed after unary operator: '-line' (1888,76): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1893,63): run-time error CSS1039: Token not allowed after unary operator: '-gb-teal' (1904,51): run-time error CSS1039: Token not allowed after unary operator: '-line' (1910,45): run-time error CSS1039: Token not allowed after unary operator: '-ink' (1915,54): run-time error CSS1039: Token not allowed after unary operator: '-gb-cta' (1915,76): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1917,52): run-time error CSS1039: Token not allowed after unary operator: '-surface' (1917,75): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1917,109): run-time error CSS1039: Token not allowed after unary operator: '-line' (1918,58): run-time error CSS1039: Token not allowed after unary operator: '-hover' (1920,61): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1921,49): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1925,67): run-time error CSS1039: Token not allowed after unary operator: '-surface' (1927,26): run-time error CSS1039: Token not allowed after unary operator: '-line-soft' (1927,67): run-time error CSS1039: Token not allowed after unary operator: '-gb-teal' (1928,23): run-time error CSS1039: Token not allowed after unary operator: '-gb-radius' (1928,53): run-time error CSS1039: Token not allowed after unary operator: '-gb-shadow' (1931,53): run-time error CSS1039: Token not allowed after unary operator: '-gb-shadow-lg' (1935,80): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1937,60): run-time error CSS1039: Token not allowed after unary operator: '-ink-soft' (1941,51): run-time error CSS1039: Token not allowed after unary operator: '-surface' (1941,74): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1941,108): run-time error CSS1039: Token not allowed after unary operator: '-line' (1942,59): run-time error CSS1039: Token not allowed after unary operator: '-gb-teal' (1942,87): run-time error CSS1039: Token not allowed after unary operator: '-hover' (1943,49): run-time error CSS1039: Token not allowed after unary operator: '-gb-cta' (1943,71): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1946,64): run-time error CSS1039: Token not allowed after unary operator: '-gb-cta' (1947,66): run-time error CSS1039: Token not allowed after unary operator: '-surface' (1947,96): run-time error CSS1039: Token not allowed after unary operator: '-line' (1966,59): run-time error CSS1039: Token not allowed after unary operator: '-gb-shadow-lg' (1968,88): run-time error CSS1039: Token not allowed after unary operator: '-gb-navy' (1998,83): run-time error CSS1039: Token not allowed after unary operator: '-gb-teal' */ /* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } /* Allow angular.js to be loaded in body, hiding cloaked elements until templates compile. The !important is important given that there may be other selectors that are more specific or come later and might alter display. */ [ng\:cloak], [ng-cloak], .ng-cloak { display: none !important; } form { width: 100%; } fieldset { margin: 0 auto; padding: 16px; width: 938px; height: auto; } fieldset.context { margin: 0 auto; padding: 16px; background-color: #F8F8F8; width: 908px; height: auto; } /* Wrapper de Campos no Formulário */ .container-field, .container-field-half, .container-field-four { height: auto; margin-bottom: 15px; } .container-field-half { display: inline-block; width: 48%; margin-bottom: 0; } .container-field-four { display: inline-table; width: 206px; margin-right: 17px; margin-bottom: 0; } .container-field:last-of-type { margin-bottom: 15px; } label { color: #3F3F3F; font-style: normal; font-size: 13px; margin: 0 0 6px 0; display: block; } input[type="text"], input[type="password"] { -moz-border-radius: 0px !important; -webkit-border-radius: 0px !important; border-radius: 0px !important; height: 26px !important; width: 100%; font-size: 12px; border: 1px solid #DDDDDD; text-indent: 7px; line-height: 26px !important; color: #444; padding: 0; } input[type="text"]:disabled { border: 1px solid #BABBBF; background: #EEEEEE; } input:focus { border-color: #216CF2 !important; outline: none !important; } /* Attach */ input[type="submit"] { background-color: #004F75; cursor: pointer; padding-left: 20px; padding-right: 20px; height: 40px; line-height: 40px; color: #fff; border: 0; } input[type="submit"]:hover, input[type="submit"]:focus { background-color: #00ABFD; -webkit-transition: background-color 0.6s ease; -moz-transition: background-color 0.6s ease; -o-transition: background-color 0.6s ease; -ms-transition: background-color 0.6s ease; transition: background-color 0.6s ease; } input[type="submit"].processando { background: url(/Content/images/ajax-loader.gif) no-repeat scroll 7px center #004F75; text-indent: 8px; } .required { z-index: 9; height: 26px; top: -19px; position: relative; border-left: 5px solid #B20000; } aside ~ form, aside ~ div { width: 700px; margin-top: 63px; float: right; } .msg { width: 100%; margin: 14px 0 23px 0; padding: 5px 0 5px 0; text-indent: 15px; font-size: 13px; color: #444; } div.info { background-color: #D9EDF7; border: 1px solid #ADD9ED; } div.error { background-color: #E2B9BA; border: 1px solid #E2B9BA; } div.success { background-color: #DFF0D8; border: 1px solid #A3D38D; } form button, .button { min-width: 98px; height: 31px; background: url(/Content/images/bg-button.png) #DEDEDE; border: 1px solid #BABBBF; margin: 5px 0px 0 0; font-size: 13px; color: #444; cursor: pointer; } form button:disabled, .button:disabled { background-image: url(/Content/images/btn-disabled.png); color: #AEAEAE; border-color: #DDDDDF; cursor: inherit; } form button:hover, .button:hover { background-image: url(/Content/images/bg_botao_hover.png); } form button:disabled:hover, button:disabled:hover { background-image: url(/Content/images/btn-disabled.png); } /* Customização */ div > .msg { margin: 6px 0 6px 0; } /* Mensagem de erro para input */ span.error { color: #B20000; font-size: 9px; margin-top: 2px; font-weight: bold; width: 100%; position: relative; float: right; text-align: right; } .fielderror { border: 1px solid #B20000 !important; border-radius: 0 !important; } .obrigatorio { border-left: 5px solid #B20000; } #login-wrapper > header > .msg { width: 590px; margin: 5px auto; } #login-wrapper input[type=text], #login-wrapper input[type=password] { height: 39px !important; line-height: 29px; } .msg h4 { margin: 0; line-height: normal; font-weight: bold; } .msg span { padding: 0; display: block; line-height: normal; } /*Summary*/ #summary { padding: 8px 10px 12px 25px; margin: 5px 0 10px 0; background: #F2DEDE; border: 1px solid #E2B9BA; color: #444444; font-size: 14px; } #summary ul { margin: 15px 0 0 20px; } #summary ul li { margin: auto; height: 16px; margin: 3px 0 3px 0; line-height: 16px; } .FechaAviso { font-weight: bold; display: inline-block; float: right; cursor: pointer; } /* Botão Processando */ button.processando { background-image: url(/Content/images/btn_loading.gif) !important; background-repeat: no-repeat; background-position: right -12px center; } /* Campo de Upload */ .upload { position: relative; background-color: #fff; overflow: hidden; border: 1px solid #ddd; height: 26px; line-height: 26px; text-indent: 10px; font-size: 12px; } .upload input { position: absolute; display: block; width: 200%; top: 0; right: 0; margin: 0; padding: 0; font-size: 20px; cursor: pointer; opacity: 0; filter: alpha(opacity=0); } .attach { background: url(/Content/images/tic-upload.png) no-repeat center #eee; width: 26px; height: 26px; float: right; } .detail-file { float: left; font-size: 12px; margin-top: 5px; } .detail-file img { float: left; vertical-align: middle; margin-left: auto; margin-right: auto; } .detail-file span { float: left; margin-right: 10px; line-height: 18px; width: auto; text-indent: 5px; } .remover-image { margin-top: 3px; cursor: pointer; display: inline-block; } .remover-image span { margin-top: -3px; font-size: 10px; color: #666; } /* Campo obrigatórios */ #campo-obrigatorio-lembrete { float: right; height: 25px; line-height: 25px; margin-top: 5px; text-indent: 10px; font-size: 12px; border-left: 5px solid #B20000; } /* Datepicker customizado */ .k-datepicker { border-radius: 0 !important; } .datepicker .wrapper-field { height: 28px !important; } .datepicker .wrapper-field input.fielderror { border-color: #b20000 !important; } .submitedd .ng-invalid, .submitedd .ng-invalid + .k-select { border-color: #b20000 !important; } .fielderror .k-picker-wrap .k-select { border-color: #b20000 !important; } /* DropDownList customizado */ .k-dropdown + .fielderror { border: 0 !important; } div.wrapper-field.obrigatorio > span.fielderror { border-color: #b20000 !important; } .fielderror > .k-dropdown-wrap.k-state-default { border: 0 !important; } @font-face { font-family: 'SEGOEUIL'; font-weight: 300; src: local('Content/Fonts/SEGOEUIL'), url(/Content/Fonts/SEGOEUIL.woff) format('woff'), url(/Content/Fonts/SEGOEUIL.ttf) format('truetype'); } @font-face { font-family: "Segoe UI"; font-weight: 200; src: local('../../../../Content/Fonts/Segoe UI Light'); -webkit-text-stroke: 0.2px; text-rendering: optimizeLegibility; } @font-face { font-family: "Segoe UI"; font-weight: 300; src: local('../../../../Content/Fonts/Segoe UI Semilight'); -webkit-text-stroke: 0.2px; text-rendering: optimizeLegibility; } @font-face { font-family: "Segoe UI"; font-weight: 400; src: local('../../../../Content/Fonts/Segoe UI'); -webkit-text-stroke: 0.2px; text-rendering: optimizeLegibility; } @font-face { font-family: "Segoe UI"; font-weight: 600; src: local('../../../../Content/Fonts/Segoe UI Semibold'); -webkit-text-stroke: 0.2px; text-rendering: optimizeLegibility; } @font-face { font-family: "Segoe UI"; font-weight: 700; src: local('../../../../Content/Fonts/Segoe UI Bold'); -webkit-text-stroke: 0.2px; text-rendering: optimizeLegibility; } @font-face { font-family: "Segoe UI"; font-style: italic; font-weight: 400; src: local('../../../Content/Fonts/Segoe UI Italic'); -webkit-text-stroke: 0.2px; text-rendering: optimizeLegibility; } @font-face { font-family: "Segoe UI"; font-style: italic; font-weight: 700; src: local('../../../Content/Fonts/Segoe UI Bold Italic'); -webkit-text-stroke: 0.2px; text-rendering: optimizeLegibility; } @font-face { font-family: "FontAwesome"; src: local('../../../Content/FontAwesome'), url(/Content/Fonts/fontawesome-webfont.woff) format('woff'), url(/Content/fontawesome-webfont.ttf); } /* -----------------------------------*/ /* ---------->>> GLOBAL <<<-----------*/ /* -----------------------------------*/ * { font-family: 'Segoe UI', 'SEGOEUIL'; } html { height: 100% } body { width: auto; height: 100%; } /* -----------------------------------*/ /* ------>>> Links and Types <<<-------*/ /* -----------------------------------*/ /* Cabeçalhos */ h1.error { color: #B20000 !important; } #wrapper-header h2 { color: #fff; width: auto; font-weight: bold; text-transform: uppercase; } #client h2 { text-transform: none; font-weight: 200; text-indent: 20px; } #product h2 { font-weight: 400; } h3 { font-size: 16px; font-weight: 400; color: #444; text-transform: uppercase; } #content h3 { margin: 24px 0 30px 0; } aside h4 { font-size: 13px; color: #576477; font-weight: 400; text-transform: uppercase; } /* Text */ strong { font-weight: bold; } /* Links */ a { text-decoration: none; color: #004F75; font-size: 14px; font-weight: 200; } a:active, a:hover { outline: 0; } header nav ul li a { display: block; line-height: 32px; float: left; text-decoration: none; padding: 0 15px 0 15px; } ul.dropdown li a { display: block; color: #fff; width: 220px; text-transform: none } #breadcrumb ol li a:after { content: ' >'; } #breadcrumb ol li a { color: #004D73; font-size: 12px; } aside nav li a { color: #3F3F3F; line-height: 30px; display: block; } aside nav li.selected a { background-color: #DDF2FF; } section#options ul li a { width: 140px; height: 140px; float: left; background-color: #2DAEBF; margin-right: 20px; color: #fff; font-size: 14px; text-align: right; display: table; } section#options ul li a span { vertical-align: bottom; position: relative; display: table-cell; top: -10px; left: -10px; } section#options ul li a:hover { background-color: #42C3D4; } /* Listas */ ul li:hover > ul.dropdown { display: block; } #user ul { float: right !important } #user ul li { text-align: right; width: 100% } header nav ul li { display: inline; font-size: 14px; background-color: #fff; text-align: left; } header ul { cursor: pointer; } ul.dropdown { background-color: #013F5C; display: none; color: #ECECEC; visibility: visible; z-index: 1; position: absolute; padding: 5px; float: left; width: 250px !important; } #user ul li > ul.dropdown { float: none;position: relative; text-align: right } #user ul li > ul.dropdown li a { width: 100% } #user ul li > ul.dropdown li a span { margin-right: 18px; } #user ul li:hover > ul.dropdown li a:hover { background-color: #2DAEBF; } #breadcrumb ol { margin-top: 38px; height: 30px; cursor: auto; font-weight: 200; font-size: 12px; } #breadcrumb ol li { display: inline; color: #576477; } section#options ul { width: auto; background-color: #fafafa; } section#options ul li { display: inline; } aside nav li { height: 30px; text-indent: 10px; font-size: 12px; } /* -----------------------------------*/ /* --------->>> Main Layout <<<--------*/ /* -----------------------------------*/ /* 1 Envelopes*/ #wrapper { } #wrapper-header { display: block; font-size: 14px; height: 75px; } /* 2 Header */ #topo-header { height: 40px; line-height: 40px; } #producer { width: 180px; float: left; height: inherit; } #client { width: auto; float: left; } #bottom-header { height: 30px; line-height: 30px; } #product { float: left; } #user { float: right; color: #fff; font-size: 12px; text-indent: 15px; text-transform: uppercase; width: 300px; } #breadcrumb { clear: both; } /* 3. Wrapper de conteúdo */ #content { width: 940px; display: block; } /* ___3.1 Menu lateral */ aside { margin-top: 63px; width: 228px; min-height: 556px; border-right: 1px solid #E7E9ED; float: left; } aside nav { width: 215px; height: auto; margin-top: 8px; } /* ___3.2 Seção da página inícial */ section#options { margin-top: 20px; } /* ___3.3 Definições de Colunas */ .left-column, .right-column { width: 438px; display: inline-block; vertical-align: top; } .left-column { margin-right: 26px; } /* 4. Footer */ footer { text-transform: uppercase; background-color: #004A6D; color: #fff; height: 20px; text-align: center; vertical-align: middle; font-size: 12px; line-height: 20px; margin-top: 25px; } /* -----------------------------------*/ /* --------->>> Overrides <<<---------*/ /* -----------------------------------*/ header nav ul li ul.dropdown { margin-top: 30px; } #user ul li .special-character { margin-left: 13px; } #user ul li .dropdown li a:hover { width: 100%; } header nav ul li .special-character { margin: 0 0 0 9px; } /* -----------------------------------*/ /* ------->>> Miscellaneous <<<--------*/ /* -----------------------------------*/ .center-content { margin: 0 auto; width: 940px; } .right-content { width: 700px; margin-top: 63px; float: right; } .special-character { font-family: 'FontAwesome'; font-weight: lighter; height: auto; } .clearfix { clear: both; } .right { float: right; } .left { float: right; } #loaderDiv { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1100; color: #fff; background-color: black; opacity: .8; } .ajax-loader { position: absolute; left: 50%; top: 50%; margin-left: -160px; margin-top: -32px; display: block; } .ajax-loader span { height: 65px; line-height: 65px; float: left; margin-right: 10px; } .preloading {background-color: #fff; background-image: url(/Content/images/spinner.gif);background-repeat: no-repeat; background-position: 50% 50%; } body { } table { border-spacing: 0px !important; } .k-input, .k-textbox { color: #444444 !important; font-size: 12px !important; -moz-border-radius: 0px !important; -webkit-border-radius: 0px !important; border-radius: 0px !important; height: 26px !important; line-height: 26px !important; margin: 0px !important; padding: 0px; } .k-input, .k-textbox { border: 1px solid #DDDDDD !important; background-color: #FFFFFF !important; } .k-input, .k-textbox { padding: 0px !important; } .k-input:focus, .k-textbox:focus { border-color: #216CF2 !important; outline: none !important; } .k-dropdown-wrap .k-input, .k-picker-wrap .k-input, .k-numeric-wrap .k-input, .k-state-border-down { border-radius: 0 !important; } .k-list-container.k-state-border-down, .k-autocomplete.k-state-border-down, .k-dropdown-wrap.k-state-border-down, .k-picker-wrap.k-state-border-down, .k-numeric-wrap.k-state-border-down { padding-bottom: 0px; } .k-block, .k-button, .k-textbox, .k-drag-clue, .k-touch-scrollbar, .k-window, .k-window-titleless .k-window-content, .k-window-action, .k-inline-block, .k-grid .k-filter-options, .k-grouping-header .k-group-indicator, .k-autocomplete, .k-multiselect, .k-dropdown-wrap, .k-datepicker, .k-timepicker, .k-colorpicker, .k-datetimepicker, .k-numerictextbox, .k-picker-wrap, .k-numeric-wrap, .k-colorpicker.k-list-container, .k-calendar-container, .k-calendar td, .k-calendar .k-link, .k-treeview .k-in, .k-editor-button .k-state-hover, .k-editor-button .k-state-active, .k-tooltip, .k-tile, .k-slider-track, .k-slider-selection { border-radius: 0; } /* COMBOBOX */ span.k-input { border: 0px !important; height: 26px !important; } .k-item, .k-state-selected, .k-list-optionlabel { color: #444444 !important; font-size: 12px !important; -webkit-border-radius: 0 0 0!important; } .k-textbox > input, .k-autocomplete .k-input, .k-picker-wrap .k-input, .k-numeric-wrap .k-input, .k-dropdown-wrap .k-input, .k-selectbox .k-input { line-height: 26px; } .k-state-hover { background-color: #ECF8FF !important; border-color: #ECF8FF !important; } .k-dropdown-wrap.k-state-default { color: #444444 !important; font-size: 12px !important; border: 1px !important; border-style: solid !important; border-color: #DDDDDD !important; background-color: #FFFFFF !important; height: 26px !important; padding-left: 1px; -webkit-border-radius: 0 !important; } .k-dropdown-wrap.k-state-disabled { padding-left: 5px; } .k-dropdown-wrap.k-state-default.input-validation-error { border-color: #B20000 !important; } .k-editor-toolbar { margin: 2px; } .k-editor-toolbar .k-colorpicker { width: auto !important; } .k-editor-toolbar .k-editor-widget { width: auto !important; } .k-editor-toolbar .k-fontName, .k-fontSize { border: 0px !important; } .k-editor-toolbar .k-select { border: 0px !important; } .k-editor-toolbar .k-picker-wrap { padding: 0 25px 0 0 !important; height: 26px; line-height: 1em; } .k-editor .k-editable-area{ border-width: 0px; } /*GRID*/ .k-grid { background: #fff; color: #444; width: 100%; margin-top: 5px; font-size: 12px; } .k-grid .k-grid-header th { background: #fff !important; border-width: 0 0 1px 0; } .k-grid tr { height: 30px; } .k-link { color: #444 !important; } .k-grid .k-grid-pager .k-link { border: none !important; -webkit-border-radius: 13px; -o-border-radius: 0; border-radius: 0; margin: 1px; opacity: 1!important; } .k-grid .k-grid-pager .k-link:hover { border: 1px solid #BABBBF !important; background: #F5F5F5; margin: 0px; opacity: 1 !important; } .k-grid .k-grid-pager .k-link .k-state-disabled { opacity: 1 !important; } .k-grid .k-grid-pager .k-link .k-icon .k-i-seek-e { opacity: 1 !important; } .k-grid tbody tr:hover { background: #ECF8FF !important; } .k-grid tbody tr.k-state-selected { background: #DDF2FF!important; color: #444 !important; } .k-grid tbody tr.k-alt { background: #F5F5F5; } .grid-informacoes.k-grid thead th { text-indent: 23px; } .grid-informacoes.k-grid tbody td { padding-left: 30px; } .k-grid tbody td { border: none; max-width: 130px; } .k-grid .k-pager-info { float: none !important; } .k-grid .k-pager-info.k-label { float: right !important; margin-right: -20px; } .k-grid .k-pager-sizes.k-label { float: right !important; } .k-grid .k-header, .k-grid-header, .k-toolbar, .k-dropdown-wrap, .k-picker-wrap, .k-grouping-header, .k-pager-wrap, .k-textbox, .k-button, .k-draghandle, .k-autocomplete, .k-state-highlight, .k-tabstrip-items .k-item, .k-state-selected { background: #fff !important; } .k-grid .k-grid-pager .k-link:not(.k-state-disabled):hover > .k-i-seek-e, .k-state-hover .k-i-seek-e, .k-button:hover .k-i-seek-e, .k-textbox:hover .k-i-seek-e, .k-button:active .k-i-seek-e { background-position: -0px -80px; opacity: 1 !important; } .k-grid-header .k-header a.k-link { background: #F5F5F5; } .k-autocomplete.k-header { width: 100%; } .k-picker-wrap.k-state-default .k-input { padding-left: 1px; } .k-editor-toolbar-wrap a.k-state-selected { background: #333333 !important; /* Old browsers */ background: url(/Content/Styles/Common/data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzMzMzMzMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM3ZDdlN2QiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+) !important; background: -moz-linear-gradient(top, #333333 0%, #7d7e7d 100%) !important; /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#333333), color-stop(100%,#7d7e7d)) !important; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #333333 0%,#7d7e7d 100%) !important; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #333333 0%,#7d7e7d 100%) !important; /* Opera 11.10+ */ background: -ms-linear-gradient(top, #333333 0%,#7d7e7d 100%) !important; /* IE10+ */ background: linear-gradient(to bottom, #333333 0%,#7d7e7d 100%) !important; /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#333333', endColorstr='#7d7e7d',GradientType=0 ) !important; /* IE6-8 */ padding: 3px 4px !important; } .k-editor-toolbar-wrap { font-size: 15px !important; } .k-animation-container a.k-state-selected{ background: #333333 !important; padding: 1px 1px 1px 1px !important; } a.k-state-selected { background: #DDF2FF !important; border: 0px !important; padding: 1px 5px 1px 5px !important; background: #333333 !important; background: url(/Content/Styles/Common/data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJod…EiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+) !important; background: -moz-linear-gradient(top, #333333 0%, #7d7e7d 100%) !important; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#333333), color-stop(100%,#7d7e7d)) !important; background: -webkit-linear-gradient(top, #333333 0%,#7d7e7d 100%) !important; background: -o-linear-gradient(top, #333333 0%,#7d7e7d 100%) !important; background: -ms-linear-gradient(top, #333333 0%,#7d7e7d 100%) !important; background: linear-gradient(to bottom, #333333 0%,#7d7e7d 100%) !important; filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#333333', endColorstr='#7d7e7d',GradientType=0 ) !important; } .k-tool.k-group-end, .k-toolbar .k-button-group .k-group-end, .k-toolbar .k-split-button .k-split-button-arrow { border-radius: 0 4px 4px 0 !important; } .k-tool.k-group-start, .k-toolbar .k-split-button .k-button, .k-toolbar .k-button-group .k-group-start { border-radius: 4px 0 0 4px !important; } .k-dropdown-wrap.k-state-focused { font-size: 12px !important; border-color: #216CF2 !important; -webkit-box-shadow: none !important; } .k-list-container.k-popup.k-group.k-reset { -webkit-border-radius: 0 0 0!important; -moz-border-radius: 0px !important; box-shadow: 0 0 0; } .k-item.k-state-focused { background: #DDF2FF!important; } .k-select { padding-bottom: 2px !important; } .k-select:hover { background-color: #EEEEEE !important; -webkit-border-radius: 0 0 0!important; } .k-dropdown-wrap.k-state-focused .k-select { background-color: #EEEEEE !important; -webkit-border-radius: 0 0 0!important; } .k-dropdown-wrap.k-state-disabled, .k-dropdown-wrap.k-state-disabled .k-input, .k-dropdown-wrap.k-state-disabled .k-icon.k-i-arrow-s, .k-dropdown-wrap.k-state-disabled .k-select { background-color: #FBFBFB !important; } .k-picker-wrap.k-state-disabled .k-icon.k-i-arrow-s, .k-picker-wrap.k-state-disabled .k-select { background-color: #FBFBFB !important; } .k-dropdown-wrap.k-state-disabled { color: #BABBBF !important; background-color: #FBFBFB !important; border: 1px solid !important; border-color: #DDDDDD !important; } /* INPUT KENDO */ .k-widget.k-calendar td.k-state-selected a, .k-widget.k-calendar td.k-state-focused a { color: #777; background: #DDF2FF!important; } .k-textbox, .k-autocomplete .k-input, .k-progress, .k-progress-status, .k-numeric-wrap.k-expand-padding .k-input, .k-multiselect-wrap { -moz-border-radius: 0px !important; -webkit-border-radius: 0px !important; border-radius: 0px !important; } .k-state-focused, .k-list > .k-state-focused { -webkit-box-shadow: inset 0 0 0 0; box-shadow: inset 0 0 0 0; border-color: transparent !important; } .k-textbox, .k-autocomplete, .k-dropdown-wrap, .k-picker-wrap, .k-numeric-wrap { border: none; } .k-colorpicker .k-picker-wrap.k-state-default { border: 1px !important; border-style: solid !important; border-color: #DDDDDD !important; } .k-popup.k-list-container, .k-popup.k-calendar-container { border: 1px solid #DDDDDD !important; background: #fff; } div.k-animation-container.km-popup { margin-left: 0 !important; } .k-animation-container:not(.km-popup) .k-list-container.k-popup.k-group.k-reset { margin-left: 0px !important; } .k-calendar-container.k-state-border-up, .k-list-container.k-state-border-up, .k-autocomplete.k-state-border-up, .k-multiselect.k-state-border-up, .k-dropdown-wrap.k-state-border-up, .k-picker-wrap.k-state-border-up, .k-numeric-wrap.k-state-border-up, .k-window-content, .k-filter-menu { -moz-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px; } .k-popup, .k-menu .k-group, .k-grid .k-filter-options, .k-time-popup, .k-datepicker-calendar, .k-autocomplete.k-state-border-down, .k-autocomplete.k-state-border-up, .k-dropdown-wrap.k-state-active, .k-picker-wrap.k-state-active, .k-multiselect.k-state-focused, .k-imagebrowser .k-image, .k-tooltip { -webkit-box-shadow: none; box-shadow: none; } li.k-item, .k-state-selected, .k-list-optionlabel { min-height: 26px; } li.k-item:hover, .k-state-selected:hover, .k-list-optionlabel:hover { background: #ECF8FF !important; border-color: transparent !important; } .k-popup.k-list-container, .k-popup.k-calendar-container { padding: 0px !important; } .k-widget.k-datepicker.k-header { width: 100% !important; } span.k-datepicker, span.k-timepicker, span.k-datetimepicker, span.k-colorpicker, span.k-numerictextbox, span.k-combobox, span.k-dropdown { background-image: none; width: 100%; } .k-calendar th { background-color: #fff; } .k-widget.k-calendar .k-header { background: #fff; } .k-picker-wrap { padding: 0 13px 0 0 !important; } .k-picker-wrap .k-select { border-width: 1px 1px 1px 0 !important; border-color: #DDDDDD !important; background: #fff; -moz-border-radius: 0px !important; -webkit-border-radius: 0px !important; border-radius: 0px !important; height: auto; box-sizing: content-box; } .k-widget.k-datepicker.k-header .k-state-focused { -webkit-box-shadow: none !important; box-shadow: none !important; } .k-picker-wrap .k-select, .k-numeric-wrap .k-select, .k-dropdown-wrap .k-select { min-height: 23px !important; line-height: 22px !important; vertical-align: middle !important; padding-top: 1px !important; } .k-picker-wrap .k-select{ width: 23px; } .k-dropdown-wrap .k-select{ height: auto; box-sizing: content-box; } .k-picker-wrap.k-state-focused .k-select { background: #eee !important; z-index: 9999; border-width: 1px 1px 1px 0 !important; border-color: #216CF2 !important; -webkit-box-shadow: none !important; box-shadow: none !important; } .k-picker-wrap.k-state-hover .k-select { background: #eee !important; z-index: 99; border-width: 1px 1px 1px 0 !important; border-color: #ddd; -webkit-box-shadow: none !important; box-shadow: none !important; } .k-widget.k-datepicker.k-header.k-state-border-down { border-bottom-width: 0px !important; padding-bottom: 0px !important; } .k-picker-wrap.k-state-default.k-state-active.k-state-border-down { border-bottom-width: 0px !important; padding-bottom: 0px !important; } .k-widget.k-calendar td.k-state-hover { background: #fff; border: none !important; -webkit-border-radius: 0px; -o-border-radius: 0; border-radius: 0; } .k-widget.k-calendar td.k-state-selected, .k-widget.k-calendar td.k-state-focused { background: #DDF2FF !important; border: 0px !important; -webkit-border-radius: 0px; -o-border-radius: 0; border-radius: 0; color: #777; } .k-state-focused, td.k-state-focused, .k-button:focus, .k-button.k-state-focused { -webkit-box-shadow: none !important; box-shadow: none !important; } .k-icon, .k-state-disabled .k-icon, .k-column-menu .k-sprite { opacity: 1; } td.k-today a { color: #777 !important; border: 0px !important; } .k-widget.k-calendar .k-link { font-size: 13px !important; font-family: 'Segoe UI'; background: #fff; border: 0px !important; -webkit-border-radius: 0px; -o-border-radius: 0; border-radius: 0; } .k-widget.k-calendar .k-link:hover { background: #ECF8FF !important; border: 0px !important; } .k-content.k-meta-view td.k-state-focused { background: #fff !important; border: 0px !important; -webkit-border-radius: 0px; -o-border-radius: 0; border-radius: 0; } .k-content.k-meta-view td.k-state-focused a { background: #DDF2FF !important; border: 0px !important; -webkit-border-radius: 0px; -o-border-radius: 0; border-radius: 0; color: #777; } .k-editor-dialog .k-checkbox { margin: 0px !important; position: relative; } button.k-dialog-insert.k-button.k-primary, button.k-dialog-close.k-button { border: 1px solid #BABBBF; background: url(/Content/Styles/Common/Imagens/bg_botao.png) repeat-x !important; font-family: Segoe UI !important; font-size: 14px !important; color: #444 !important; padding-top: 0px; padding-bottom: 0px; } button.k-dialog-insert.k-button.k-primary:hover, button.k-dialog-close.k-button:hover { border: 1px solid #BABBBF; background: url(/Content/Styles/Common/Imagens/bg_botao_hover.png) repeat-x !important; font-size: 14px; } .k-checkbox:checked+.k-checkbox-label:after { color: #000000; } /* ============================================================================ ps-logado.css — Tema da ÁREA LOGADA do Portal do Servidor (GOVBR) ---------------------------------------------------------------------------- Identidade visual Governança Brasil: interface clara, limpa e moderna. TODAS as regras são escopadas em "#wrapper.login" (classe presente apenas quando o usuário está autenticado — ver _Layout.cshtml: ng-class="{login: ctrl.acessoServices.isLogged}"). A tela de LOGIN não recebe a classe .login, portanto NADA aqui a afeta. Os tokens --gb-* também são declarados no próprio #wrapper.login (não em :root), reforçando o isolamento. Bundle: incluído automaticamente em ~/Content/Template/Styles/Common. ---------------------------------------------------------------------------- ÍNDICE (ordem do arquivo · banners: "=====" = seção, "-----" = subseção) 1. TOKENS (--gb-*, no #wrapper.login abaixo) 2. TOPBAR 3. SIDEBAR 4. BREADCRUMB + ÁREA DE CONTEÚDO 5. TÍTULOS/TIPOGRAFIA 6. CARTÕES 7. BOTÕES 8. ABAS 9. TELA INICIAL (atalhos) 10. TABELAS/KENDO GRID 11. RODAPÉ 12. RESPONSIVO 13. TELA INICIAL (hero + cartões) 14. TELA CONTRACHEQUE 15. TELA RENDIMENTOS 16. TELA ALTERAÇÃO CADASTRAL (resumo de erros · anexo · termo) 17. MENSAGENS (toasts) 18. COMPONENTES DO PROTÓTIPO (grade de 12 colunas) 19. CONTRACHEQUE (barra + cartões) 20. OVERLAY DE BUSCA 21. LOADER GLOBAL (spinner) Arquitetura e convenções de TODO o CSS: ver Content/Styles/README.md. ========================================================================== */ #wrapper.login { --gb-navy: #09274c; --gb-navy-light: #1a3a5c; --gb-green: #9ace45; --gb-teal: #6fbfd1; --gb-cta: #a8e128; --gb-bg: #f4f6f9; --gb-white: #ffffff; --gb-red: #e74c3c; --gb-amber: #e67e22; --ink: #1d2b3a; --ink-soft: #5a6470; --line: #e7ecf2; --line-soft: #eef2f6; --surface: #ffffff; --hover: #f0f5fa; --ps-sw: 256px; /* largura da sidebar */ --ps-th: 62px; /* altura da topbar */ --gb-radius: 12px; --gb-shadow: 0 2px 10px rgba(9,39,76,.08); --gb-shadow-lg: 0 8px 28px rgba(9,39,76,.12); background: var(--gb-bg); min-height: 100vh; } /* ===================== TOPBAR ===================== */ #wrapper.login .ps-topbar { position: fixed; top: 0; left: 0; right: 0; height: var(--ps-th); z-index: 1000; background: var(--gb-navy); color: #fff; display: flex; align-items: center; gap: 16px; padding: 0 20px; box-shadow: 0 2px 14px rgba(9,39,76,.18); } #wrapper.login .ps-brand { display: flex; align-items: center; gap: 12px; min-width: calc(var(--ps-sw) - 36px); } #wrapper.login .ps-logo { width: 34px; height: 34px; flex-shrink: 0; } #wrapper.login .ps-brand-txt { display: flex; flex-direction: column; line-height: 1.1; } #wrapper.login .ps-brand-name { font-size: 1rem; font-weight: 700; color: #fff; letter-spacing: .2px; } #wrapper.login .ps-brand-sub { font-size: .68rem; opacity: .62; text-transform: uppercase; letter-spacing: .05em; margin-top: 2px; } #wrapper.login .ps-top-spacer { flex: 1; } #wrapper.login .ps-icon-btn { width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; color: #fff; transition: background .15s; } #wrapper.login .ps-icon-btn svg { width: 20px; height: 20px; stroke: #fff !important; } #wrapper.login .ps-icon-btn svg * { stroke: #fff !important; } #wrapper.login .ps-icon-btn:hover { background: rgba(255,255,255,.12); } /* chip do usuário + dropdown "Sair" (hover/focus, sem depender de JS) */ #wrapper.login .ps-user { position: relative; } #wrapper.login .ps-user-chip { display: flex; align-items: center; gap: 10px; padding: 5px 12px 5px 5px; border-radius: 999px; cursor: pointer; transition: background .15s; outline: none; } #wrapper.login .ps-user-chip:hover, #wrapper.login .ps-user-chip:focus { background: rgba(255,255,255,.12); } #wrapper.login .ps-avatar { width: 34px; height: 34px; border-radius: 50%; flex-shrink: 0; background: linear-gradient(135deg, var(--gb-teal), var(--gb-green)); display: grid; place-items: center; color: var(--gb-navy); font-weight: 700; font-size: .85rem; text-transform: uppercase; } #wrapper.login .ps-user-name { font-size: .82rem; font-weight: 600; color: #fff; max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #wrapper.login .ps-caret { color: #fff; font-size: .7rem; opacity: .8; } #wrapper.login .ps-dropdown { position: absolute; top: calc(100% + 8px); right: 0; min-width: 170px; background: #fff; border-radius: 10px; box-shadow: var(--gb-shadow-lg); list-style: none; margin: 0; padding: 6px; opacity: 0; visibility: hidden; transform: translateY(-6px); transition: .15s; z-index: 1001; } #wrapper.login .ps-user:hover .ps-dropdown, #wrapper.login .ps-user-chip:focus + .ps-dropdown, #wrapper.login .ps-dropdown:hover { opacity: 1; visibility: visible; transform: none; } #wrapper.login .ps-dropdown li { display: block; width: auto; text-align: left; } #wrapper.login .ps-dropdown li a { display: block; padding: 9px 14px; border-radius: 7px; color: var(--ink); font-size: .85rem; font-weight: 600; cursor: pointer; } #wrapper.login .ps-dropdown li a:hover { background: var(--hover); color: var(--gb-navy); } /* ===================== SIDEBAR ===================== */ #wrapper.login .ps-sidebar { position: fixed; top: var(--ps-th); left: 0; bottom: 0; width: var(--ps-sw); z-index: 900; background: var(--surface); border-right: 1px solid var(--line); display: flex; flex-direction: column; padding: 14px 12px; overflow-y: auto; } #wrapper.login .ps-nav-group { margin-bottom: 8px; } #wrapper.login .ps-nav-label { font-size: .64rem; text-transform: uppercase; letter-spacing: .1em; color: var(--ink-soft); font-weight: 700; opacity: .7; padding: 12px 12px 6px; } #wrapper.login .ps-sidebar .ps-nav-item { display: flex; align-items: center; gap: 12px; padding: 11px 12px; border-radius: 10px; color: var(--ink-soft); font-size: .85rem; font-weight: 600; line-height: 1.2; text-decoration: none; cursor: pointer; position: relative; transition: background .13s, color .13s; } #wrapper.login .ps-sidebar .ps-nav-item svg { width: 20px; height: 20px; flex-shrink: 0; stroke-width: 1.8; } #wrapper.login .ps-sidebar .ps-nav-item:hover { background: var(--hover); color: var(--gb-navy); } #wrapper.login .ps-sidebar .ps-nav-item.ps-active { background: linear-gradient(90deg, rgba(111,191,209,.16), rgba(154,206,69,.10)); color: var(--gb-navy); } #wrapper.login .ps-sidebar .ps-nav-item.ps-active::before { content: ""; position: absolute; left: -12px; top: 8px; bottom: 8px; width: 4px; border-radius: 0 4px 4px 0; background: var(--gb-teal); } #wrapper.login .ps-sidebar-foot { margin-top: auto; padding-top: 12px; } #wrapper.login .ps-help { background: linear-gradient(135deg, var(--gb-navy), var(--gb-navy-light)); color: #fff; border-radius: var(--gb-radius); padding: 14px 16px; display: flex; flex-direction: column; gap: 3px; } #wrapper.login .ps-help b { font-size: .82rem; } #wrapper.login .ps-help span { font-size: .72rem; opacity: .72; } #wrapper.login .ps-help a { margin-top: 8px; align-self: flex-start; background: var(--gb-cta); color: var(--gb-navy); font-weight: 700; font-size: .74rem; padding: 6px 12px; border-radius: 8px; text-decoration: none; } /* hamburger (somente mobile) */ #wrapper.login .ps-nav-toggle { display: none; } #wrapper.login .ps-burger { display: none; flex-direction: column; gap: 4px; width: 40px; height: 40px; border-radius: 10px; cursor: pointer; align-items: center; justify-content: center; } #wrapper.login .ps-burger span { display: block; width: 20px; height: 2px; background: #fff; border-radius: 2px; } #wrapper.login .ps-burger:hover { background: rgba(255,255,255,.12); } /* ===================== BREADCRUMB + ÁREA DE CONTEÚDO ===================== */ #wrapper.login .ps-crumb { margin-left: var(--ps-sw); padding: 76px 34px 0; } #wrapper.login .ps-crumb #breadcrumb, #wrapper.login #breadcrumb ol { margin: 0; height: auto; } #wrapper.login #breadcrumb ol { list-style: none; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: .76rem; } #wrapper.login #breadcrumb ol li { display: inline-flex; align-items: center; color: var(--ink-soft); } #wrapper.login #breadcrumb ol li a { color: var(--ink-soft); font-size: .76rem; font-weight: 500; } #wrapper.login #breadcrumb ol li a:after { content: "/"; margin: 0 4px; opacity: .5; } #wrapper.login #breadcrumb ol li.active span { color: var(--gb-navy); font-weight: 600; } /* container externo (filho direto de #wrapper) recebe o recuo da sidebar/topbar */ #wrapper.login > .center-content { width: auto; max-width: none; margin: 0 0 0 var(--ps-sw); padding: 0; } #wrapper.login #wrapper-content-angular { display: block; padding: 8px 34px 70px; } /* container interno de cada módulo (#content.center-content dentro do ui-view) */ #wrapper.login #wrapper-content-angular .center-content { width: auto; max-width: 1180px; margin: 0 auto; display: block; } /* ===================== TÍTULOS / TIPOGRAFIA ===================== */ #wrapper.login #wrapper-content-angular h3, #wrapper.login #content h3 { font-size: 1.45rem; font-weight: 700; color: var(--gb-navy); text-transform: none; letter-spacing: -.01em; margin: 6px 0 20px; } /* ===================== CARTÕES (formulários, grids, blocos) ===================== */ #wrapper.login form.filters, #wrapper.login fieldset.context, #wrapper.login #box-border-form, #wrapper.login .k-grid { background: var(--surface); border: 1px solid var(--line-soft); border-radius: var(--gb-radius); box-shadow: var(--gb-shadow); } #wrapper.login form.filters { padding: 22px 24px; } #wrapper.login fieldset.context { border: none; box-shadow: none; background: transparent; padding: 0; } #wrapper.login fieldset.context legend { display: none; } #wrapper.login #box-border-form { padding: 22px 24px; margin-top: 4px; } /* layout das colunas de filtro: flexível e responsivo */ #wrapper.login fieldset.context > div { display: flex; flex-wrap: wrap; gap: 18px 26px; } #wrapper.login .container-field { margin-bottom: 14px; } #wrapper.login .container-field label { display: block; font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-soft); font-weight: 700; margin-bottom: 5px; } /* ===================== BOTÕES ===================== */ #wrapper.login form.filters button, #wrapper.login form button[type="submit"] { display: inline-flex; align-items: center; gap: 8px; margin: 6px 10px 0 0; padding: 10px 20px; border-radius: 10px; font-size: .85rem; font-weight: 700; background: var(--gb-cta); color: var(--gb-navy); border: none; cursor: pointer; transition: background .15s, box-shadow .15s; } #wrapper.login form.filters button:hover, #wrapper.login form button[type="submit"]:hover { background: #97cc1e; box-shadow: 0 4px 14px rgba(168,225,40,.4); } #wrapper.login form.filters button[type="reset"] { background: var(--surface); color: var(--gb-navy); border: 1px solid var(--line); } #wrapper.login form.filters button[type="reset"]:hover { background: var(--hover); box-shadow: none; } #wrapper.login form button:disabled { opacity: .55; cursor: not-allowed; box-shadow: none; } /* ===================== ABAS (Alteração Cadastral) ===================== */ #wrapper.login #tab { list-style: none; margin: 0 0 18px; padding: 4px; display: inline-flex; flex-wrap: wrap; gap: 4px; background: var(--line-soft); border-radius: 12px; } #wrapper.login #tab li { padding: 9px 16px; border-radius: 8px; font-size: .82rem; font-weight: 600; color: var(--ink-soft); cursor: pointer; transition: .13s; } #wrapper.login #tab li:hover { color: var(--gb-navy); } #wrapper.login #tab li.selected { background: #fff; color: var(--gb-navy); box-shadow: 0 1px 4px rgba(9,39,76,.12); } /* ===================== TELA INICIAL — atalhos ===================== */ #wrapper.login section#options { margin-top: 8px; } #wrapper.login section#options ul { width: auto; background: transparent; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 18px; } #wrapper.login section#options ul li { display: flex; } #wrapper.login section#options ul li a { flex: 1; width: 100%; height: 100%; box-sizing: border-box; float: none; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; min-height: 120px; background: var(--surface); color: var(--gb-navy); border: 1px solid var(--line-soft); border-radius: var(--gb-radius); box-shadow: var(--gb-shadow); padding: 18px; font-size: 1rem; font-weight: 700; text-align: left; cursor: pointer; transition: transform .16s, box-shadow .16s, border-color .16s; } #wrapper.login section#options ul li a:hover { background: var(--surface); transform: translateY(-3px); box-shadow: var(--gb-shadow-lg); border-color: var(--gb-teal); } #wrapper.login section#options ul li a span { display: block; position: static; top: auto; left: auto; } /* ===================== TABELAS / KENDO GRID (toques leves) ===================== */ #wrapper.login .k-grid { overflow: hidden; } #wrapper.login .k-grid .k-grid-header, #wrapper.login .k-grid th.k-header { background: var(--gb-navy); color: #fff; border-color: var(--gb-navy); } #wrapper.login .k-grid th.k-header { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; } #wrapper.login .k-grid td { border-color: var(--line-soft); color: var(--ink); } #wrapper.login .k-grid tr:hover td { background: var(--hover); } #wrapper.login .k-grid .k-alt { background: #f7f9fb; } /* ===================== RODAPÉ ===================== */ #wrapper.login footer { margin-left: var(--ps-sw); margin-top: 0; background: var(--gb-navy); color: #fff; text-transform: none; font-size: .76rem; height: auto; line-height: 1.4; padding: 14px 34px; } #wrapper.login footer .center-content { width: auto; max-width: 1180px; margin: 0 auto; } /* ===================== RESPONSIVO ===================== */ @media (max-width: 1100px) { #wrapper.login #wrapper-content-angular { padding: 8px 20px 60px; } #wrapper.login .ps-crumb { padding: 76px 20px 0; } } @media (max-width: 860px) { #wrapper.login .ps-burger { display: flex; } #wrapper.login .ps-brand { min-width: auto; } #wrapper.login .ps-brand-sub { display: none; } #wrapper.login .ps-user-name { display: none; } #wrapper.login .ps-sidebar { transform: translateX(-100%); transition: transform .25s; box-shadow: var(--gb-shadow-lg); } #wrapper.login .ps-nav-toggle:checked ~ .ps-sidebar { transform: none; } #wrapper.login > .center-content, #wrapper.login .ps-crumb, #wrapper.login footer { margin-left: 0; } } @media (max-width: 560px) { #wrapper.login fieldset.context > div { flex-direction: column; gap: 0; } #wrapper.login section#options ul { grid-template-columns: 1fr; } #wrapper.login #wrapper-content-angular { padding: 8px 14px 50px; } #wrapper.login .ps-crumb { padding: 74px 14px 0; } } /* ===================== TELA INICIAL — hero + cartões de atalho ===================== */ #wrapper.login .ps-hero { margin: 4px 0 22px; } #wrapper.login .ps-hero h3 { margin: 0 0 4px; } #wrapper.login .ps-hero-sub { font-size: .9rem; color: var(--ink-soft); margin: 0; } #wrapper.login .ps-section-label { font-size: .7rem; text-transform: uppercase; letter-spacing: .1em; font-weight: 700; color: var(--ink-soft); margin: 0 0 12px; opacity: .8; } /* o link/cartão passa a alinhar ícone + texto */ #wrapper.login section#options ul li a { gap: 12px; align-items: flex-start; flex-direction: column; } /* caixa de ícone do atalho */ #wrapper.login section#options .ps-sc-ic { width: 46px; height: 46px; flex: 0 0 46px; border-radius: 12px; display: grid; place-items: center; position: static; } #wrapper.login section#options .ps-sc-ic svg { width: 24px; height: 24px; stroke-width: 1.8; } #wrapper.login section#options .ps-sc-ic[data-accent="green"] { background: rgba(154,206,69,.18); color: #6f9e1f; } #wrapper.login section#options .ps-sc-ic[data-accent="teal"] { background: rgba(111,191,209,.18); color: #2f8fa6; } #wrapper.login section#options .ps-sc-ic[data-accent="navy"] { background: rgba(9,39,76,.10); color: var(--gb-navy); } /* bloco de texto do atalho (título + descrição) */ #wrapper.login section#options .ps-sc-tx { display: flex; flex-direction: column; gap: 3px; position: static; } #wrapper.login section#options .ps-sc-tx b { font-size: .95rem; font-weight: 700; color: var(--gb-navy); line-height: 1.2; } #wrapper.login section#options .ps-sc-tx small { font-size: .78rem; font-weight: 400; color: var(--ink-soft); line-height: 1.35; } /* ===================== TELA CONTRACHEQUE — orientação, estados e grade ===================== */ #wrapper.login .ps-intro { font-size: .88rem; color: var(--ink-soft); margin: -8px 0 20px; } /* estado de carregamento */ #wrapper.login .ps-loading { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; font-size: .85rem; color: var(--ink-soft); background: var(--surface); border: 1px solid var(--line-soft); border-radius: var(--gb-radius); box-shadow: var(--gb-shadow); padding: 32px 24px; margin-top: 8px; } /* estado vazio */ #wrapper.login .ps-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 6px; width: 100%; box-sizing: border-box; background: var(--surface); border: 1px dashed var(--line); border-radius: var(--gb-radius); padding: 44px 24px; color: var(--ink-soft); } /* respeita o ng-hide do Angular (senao o display:flex mantinha a vazia visivel) */ #wrapper.login .ps-empty.ng-hide { display: none !important; } #wrapper.login .ps-empty svg { display: block; width: 40px; height: 40px; stroke-width: 1.5; color: var(--gb-teal); margin: 0 auto 6px; } #wrapper.login .ps-empty b { display: block; font-size: 1rem; color: var(--gb-navy); } #wrapper.login .ps-empty span { display: block; font-size: .82rem; max-width: 360px; margin: 0 auto; } #wrapper.login .ps-empty strong { color: var(--gb-navy); } /* botões de comando dentro da grade kendo (Gerar / Visualizar) */ #wrapper.login .k-grid td .k-button, #wrapper.login .k-grid td a.k-button { border-radius: 8px; font-size: .76rem; font-weight: 700; padding: 6px 12px; background: var(--surface); color: var(--gb-navy); border: 1px solid var(--line); box-shadow: none; margin-right: 6px; } #wrapper.login .k-grid td .k-button:hover { background: var(--hover); border-color: var(--gb-teal); } #wrapper.login .k-grid td .k-button:first-child { background: var(--gb-cta); color: var(--gb-navy); border-color: transparent; } #wrapper.login .k-grid td .k-button:first-child:hover { background: #97cc1e; } /* ===================== TELA RENDIMENTOS — ações e dica ===================== */ #wrapper.login form.filters button.ps-btn-ghost { background: var(--surface); color: var(--gb-navy); border: 1px solid var(--line); box-shadow: none; } #wrapper.login form.filters button.ps-btn-ghost:hover { background: var(--hover); border-color: var(--gb-teal); box-shadow: none; } #wrapper.login .ps-hint { font-size: .76rem; color: var(--ink-soft); margin: 12px 0 0; } #wrapper.login .ps-hint strong { color: var(--gb-navy); } /* ===================== TELA ALTERAÇÃO CADASTRAL ===================== */ /* ===== Resumo de erros (ng-summary) — alerta com contagem, grupos e chips clicáveis ===== */ #wrapper.login #summary.ps-errsum { background: var(--surface); border: 1px solid #f4c6c0; border-left: 4px solid var(--gb-red); border-radius: 12px; box-shadow: var(--gb-shadow); overflow: hidden; margin: 0 0 18px; } #wrapper.login .ps-errsum-head { display: flex; align-items: center; gap: 12px; padding: 13px 16px; background: #fdecea; border-bottom: 1px solid #f4c6c0; } #wrapper.login .ps-errsum-ic { flex: 0 0 36px; width: 36px; height: 36px; border-radius: 9px; background: #fff; border: 1px solid #f4c6c0; display: grid; place-items: center; color: var(--gb-red); } #wrapper.login .ps-errsum-ic svg { width: 20px; height: 20px; } #wrapper.login .ps-errsum-tx .t { font-weight: 800; color: var(--gb-navy); font-size: .92rem; } #wrapper.login .ps-errsum-tx .s { font-size: .76rem; color: var(--ink-soft); margin-top: 1px; } #wrapper.login .ps-errsum-x { margin-left: auto; border: none; background: none; cursor: pointer; color: var(--ink-soft); font-size: 1.2rem; line-height: 1; padding: 4px 6px; } #wrapper.login .ps-errsum-x:hover { color: var(--gb-red); } #wrapper.login .ps-errsum-body { padding: 4px 16px 12px; } #wrapper.login .ps-errsum-grp { padding: 10px 0; border-bottom: 1px solid var(--line); } #wrapper.login .ps-errsum-grp:last-child { border-bottom: none; } #wrapper.login .ps-errsum-gh { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-soft); } #wrapper.login .ps-errsum-gh .badge { background: rgba(231,76,60,.12); color: var(--gb-red); border-radius: 99px; font-size: .68rem; font-weight: 800; padding: 1px 8px; } #wrapper.login .ps-errsum-chips { display: flex; flex-wrap: wrap; gap: 8px; } #wrapper.login .ps-errsum-chip { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; text-decoration: none; background: #fff; border: 1px solid var(--line); border-radius: 9px; padding: 7px 11px; font-size: .82rem; font-weight: 600; color: var(--gb-navy); transition: background .15s, border-color .15s; } #wrapper.login .ps-errsum-chip::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--gb-red); flex: 0 0 7px; } #wrapper.login .ps-errsum-chip:hover { border-color: var(--gb-red); background: #fdecea; } #wrapper.login .ps-errsum-chip .arrow { color: var(--ink-soft); font-size: .8rem; } /* campos (componentes ngInput / ngSelect) */ #wrapper.login #box-border-form .container-field { margin-bottom: 16px; min-width: 0; } #wrapper.login #box-border-form .label-field, #wrapper.login #box-border-form .container-field > label { display: block; font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-soft); font-weight: 700; margin-bottom: 5px; } /* normaliza o wrapper (controlls.css forca height:28px no datepicker) */ #wrapper.login #box-border-form .wrapper-field { height: auto !important; } /* campos de texto (! para vencer controlls.css: height:26px/raio:0/!important) */ #wrapper.login #box-border-form .wrapper-field > input[type="text"], #wrapper.login #box-border-form .wrapper-field > input[type="password"] { width: 100% !important; height: 40px !important; line-height: normal !important; padding: 0 12px !important; text-indent: 0 !important; box-sizing: border-box; font-size: .9rem !important; color: var(--ink); background: #fff; border: 1px solid var(--line) !important; border-radius: 9px !important; outline: none; transition: border-color .15s, box-shadow .15s; } #wrapper.login #box-border-form .wrapper-field > input:focus { border-color: var(--gb-teal) !important; box-shadow: 0 0 0 3px rgba(111,191,209,.18) !important; } /* dropdown Kendo: mesmo padrao da barra do Contracheque (wrap 40px, raio, seta propria) */ #wrapper.login #box-border-form .wrapper-field .k-dropdown { width: 100% !important; background: transparent !important; border: 0 !important; box-shadow: none !important; } #wrapper.login #box-border-form .wrapper-field .k-dropdown .k-dropdown-wrap { position: relative; display: block; width: 100% !important; box-sizing: border-box; height: 40px !important; border: 1px solid var(--line) !important; border-radius: 9px !important; background: #fff !important; box-shadow: none !important; padding: 0 !important; } #wrapper.login #box-border-form .wrapper-field .k-dropdown .k-input { display: block; height: 38px !important; line-height: 38px !important; padding: 0 34px 0 12px !important; font-size: .9rem !important; color: var(--ink) !important; background: transparent !important; border: none !important; text-indent: 0 !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #wrapper.login #box-border-form .wrapper-field .k-dropdown .k-select { display: none !important; } #wrapper.login #box-border-form .wrapper-field .k-dropdown .k-dropdown-wrap::after { content: ""; position: absolute; right: 14px; top: 50%; margin-top: -3px; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 6px solid var(--ink-soft); pointer-events: none; } /* datepicker Kendo: wrap 40px arredondado, mantem o icone de calendario */ #wrapper.login #box-border-form .wrapper-field .k-datepicker { width: 100% !important; background: transparent !important; border: 0 !important; box-shadow: none !important; } #wrapper.login #box-border-form .wrapper-field .k-datepicker .k-picker-wrap { display: flex; align-items: center; width: 100% !important; box-sizing: border-box; height: 40px !important; border: 1px solid var(--line) !important; border-radius: 9px !important; background: #fff !important; box-shadow: none !important; padding: 0 !important; } #wrapper.login #box-border-form .wrapper-field .k-datepicker .k-input { flex: 1; width: auto !important; height: 38px !important; line-height: 38px !important; border: none !important; background: transparent !important; padding: 0 12px !important; text-indent: 0 !important; font-size: .9rem !important; color: var(--ink) !important; box-shadow: none !important; } #wrapper.login #box-border-form .wrapper-field .k-datepicker .k-select { background: transparent !important; border: none !important; width: 34px; color: var(--ink-soft); } /* estado de erro */ #wrapper.login #box-border-form .wrapper-field > input.fielderror, #wrapper.login #box-border-form .fielderror .k-dropdown-wrap, #wrapper.login #box-border-form .fielderror .k-picker-wrap { border-color: var(--gb-red) !important; box-shadow: 0 0 0 3px rgba(231,76,60,.14) !important; } /* ===== Campo de anexo (upload): dropzone + chip do arquivo ===== */ #wrapper.login #box-border-form .upload { position: relative; display: flex; align-items: center; gap: 12px; width: 100%; height: auto; min-height: 60px; line-height: normal; text-indent: 0; overflow: hidden; border: 1.5px dashed var(--line-2, #cdd6e0); border-radius: 11px; background: #f7f9fc; padding: 12px 16px 12px 60px; font-size: .85rem; font-weight: 700; color: var(--gb-navy); cursor: pointer; transition: background .15s, border-color .15s; } #wrapper.login #box-border-form .upload:hover { border-color: var(--gb-teal); background: #eef6f9; } #wrapper.login #box-border-form .upload::before { content: ""; position: absolute; left: 14px; top: 50%; transform: translateY(-50%); width: 34px; height: 34px; border-radius: 9px; background-color: rgba(111,191,209,.16); background-image: url(/Content/Styles/Common/data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%232f8fa6%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%2015V4%27%2F%3E%3Cpath%20d%3D%27M7.5%208.5%2012%204l4.5%204.5%27%2F%3E%3Cpath%20d%3D%27M4%2016v2.5A1.5%201.5%200%200%200%205.5%2020h13a1.5%201.5%200%200%200%201.5-1.5V16%27%2F%3E%3C%2Fsvg%3E); background-repeat: no-repeat; background-position: center; background-size: 19px; } #wrapper.login #box-border-form .upload::after { content: "Clique para selecionar o arquivo (PDF, JPG ou PNG)"; } #wrapper.login #box-border-form .upload input { position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; padding: 0; opacity: 0; cursor: pointer; } #wrapper.login #box-border-form .upload .attach { display: none; } #wrapper.login #box-border-form .detail-file { float: none; display: flex; align-items: center; gap: 11px; margin-top: 12px; background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 9px 12px; font-size: .84rem; } #wrapper.login #box-border-form .detail-file > img { float: none; width: 22px; height: 22px; margin: 0; flex: 0 0 auto; } #wrapper.login #box-border-form .detail-file > span { float: none; flex: 1; min-width: 0; margin: 0; text-indent: 0; line-height: 1.3; font-weight: 600; color: var(--gb-navy); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #wrapper.login #box-border-form .detail-file .remover-image { margin: 0; display: inline-flex; align-items: center; gap: 5px; flex: 0 0 auto; padding: 6px 11px; border-radius: 8px; border: 1px solid var(--line); background: #fff; cursor: pointer; transition: .15s; } #wrapper.login #box-border-form .detail-file .remover-image img { width: 14px; height: 14px; margin: 0; float: none; } #wrapper.login #box-border-form .detail-file .remover-image span { margin: 0; font-size: .74rem; font-weight: 700; color: var(--gb-navy); } #wrapper.login #box-border-form .detail-file .remover-image:hover { border-color: var(--gb-teal); background: var(--hover); } #wrapper.login #box-border-form .detail-file .remover-image:first-of-type:hover { border-color: var(--gb-red); background: #fdeeec; } #wrapper.login #box-border-form .detail-file .remover-image:first-of-type:hover span { color: var(--gb-red); } /* contêiner do formulário: fluido (anula width:894px e margin-left do Cadastral.css legado) */ #wrapper.login #wrapper-form { width: auto; margin-left: 0; max-width: 100%; } /* box-sizing em TODA a subárvore do formulário: sem isso, o width:100% do
(Cadastral.css) somava padding+borda e estourava o container, e o conteúdo era cortado à direita. Border-box resolve na raiz. */ #wrapper.login #box-border-form, #wrapper.login #box-border-form * { box-sizing: border-box; } /* agrupamento por seção (cada ng-include): empilhadas em largura total */ #wrapper.login #wrapper-form > div { display: block; } /* botão do termo de aceite (Continuar) — verde primário */ #wrapper.login #termo-aceite button { display: inline-flex; align-items: center; gap: 8px; margin-top: 16px; padding: 10px 20px; border-radius: 10px; font-size: .85rem; font-weight: 700; background: var(--gb-cta); color: var(--gb-navy); border: none; cursor: pointer; transition: background .15s, box-shadow .15s; } #wrapper.login #termo-aceite button:hover { background: #97cc1e; } #wrapper.login #termo-aceite button:disabled { opacity: .5; cursor: not-allowed; } #wrapper.login #termo-aceite button svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 2; } /* barra de ações do formulário de cadastro */ #wrapper.login .ps-formbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line-soft); } #wrapper.login .ps-formbar .ps-req { font-size: .76rem; color: var(--ink-soft); display: inline-flex; align-items: center; gap: 6px; } #wrapper.login .ps-formbar .ps-req::before { content: "*"; color: var(--gb-red); font-weight: 800; } #wrapper.login .ps-formbar-actions { display: flex; gap: 10px; flex-wrap: wrap; } /* termo de aceite (barra) */ #wrapper.login #termo-aceite { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 16px; background: var(--surface); border: 1px solid var(--line-soft); border-radius: 0 0 var(--gb-radius) var(--gb-radius); box-shadow: var(--gb-shadow); padding: 16px 20px; margin-top: 0; font-size: .9rem; color: var(--ink); } #wrapper.login #termo-aceite > span { font-weight: 600; } #wrapper.login #termo-aceite label { font-weight: 600; color: var(--ink); display: inline-flex; align-items: center; } #wrapper.login #termo-aceite input[type="checkbox"] { width: 18px; height: 18px; margin: 0 6px 0 0; vertical-align: middle; accent-color: var(--gb-teal); cursor: pointer; } #wrapper.login #termo-aceite br { display: none; } #wrapper.login #termo-aceite .ps-termo-hint { flex-basis: 100%; order: 3; font-size: .76rem; font-weight: 400; color: var(--ink-soft); display: inline-flex; align-items: center; gap: 6px; } #wrapper.login #termo-aceite button { margin: 0 0 0 auto; } /* ===== Termo (LGPD) como visualizador de documento ===== */ #wrapper.login #box-border-form #termo { max-height: 55vh; overflow-y: auto; padding: 2px 14px 2px 2px; } /* modo termo: o #box-border-form vira UM cartao unico (header + documento + aceite) */ #wrapper.login #box-border-form.ps-termo-mode { background: var(--surface); border: 1px solid var(--line-soft); border-radius: var(--gb-radius); box-shadow: var(--gb-shadow); padding: 0; overflow: hidden; } /* cabecalho azul do cartao */ #wrapper.login .ps-termo-head { display: flex; align-items: center; gap: 14px; padding: 18px 22px; background: linear-gradient(135deg, var(--gb-navy), #1a3a5c); color: #fff; } #wrapper.login .ps-termo-head .ic { flex: 0 0 42px; width: 42px; height: 42px; border-radius: 11px; background: rgba(255,255,255,.14); display: flex; align-items: center; justify-content: center; } #wrapper.login .ps-termo-head .ic svg { width: 22px; height: 22px; stroke: #fff; fill: none; stroke-width: 1.8; } #wrapper.login .ps-termo-head .t { font-size: 1.05rem; font-weight: 800; line-height: 1.2; } #wrapper.login .ps-termo-head .s { font-size: .78rem; opacity: .85; margin-top: 2px; } /* corpo do documento: sem cartao proprio, so a area de rolagem */ #wrapper.login #box-border-form.ps-termo-mode #termo { background: transparent; border: 0; box-shadow: none; border-radius: 0; padding: 6px 22px 14px; max-height: 50vh; } /* titulo e data ja aparecem no cabecalho azul: esconde os duplicados no corpo */ #wrapper.login #box-border-form.ps-termo-mode #termo h2, #wrapper.login #box-border-form.ps-termo-mode #termo h2 + p[align="right"] { display: none; } /* rodape de aceite: sem cartao proprio, so um divisor no topo */ #wrapper.login #box-border-form.ps-termo-mode #termo-aceite { border: 0; border-top: 1px solid var(--line); border-radius: 0; box-shadow: none; margin: 0; background: #fff; padding: 16px 22px; } #wrapper.login #box-border-form #termo::-webkit-scrollbar { width: 10px; } #wrapper.login #box-border-form #termo::-webkit-scrollbar-thumb { background: #cdd6e0; border-radius: 8px; border: 3px solid #fff; } #wrapper.login #box-border-form #termo h1 { font-size: .82rem; text-transform: uppercase; letter-spacing: .04em; color: var(--gb-navy); border-bottom: 2px solid var(--line); padding-bottom: 6px; margin: 22px 0 10px; } #wrapper.login #box-border-form #termo h2 { font-size: 1.02rem; color: var(--gb-navy); margin: 4px 0 10px; } #wrapper.login #box-border-form #termo p { line-height: 1.65; font-size: .9rem; color: #33414f; margin: 10px 0; text-align: justify; } #wrapper.login #box-border-form #termo a { color: #2f8fa6; } /* ===================== MENSAGENS (toasts ng-toasty) — padrão GOVBR ===================== Escopo logado; alta especificidade (#wrapper.login #toasty-container) para vencer o ng-toasty.css, que é carregado depois. Mesma estrutura/classes do componente. */ #wrapper.login #toasty-container .toasty { position: relative; display: flex; align-items: flex-start; gap: 12px; background: #fff; border: 1px solid var(--line); border-left: 4px solid var(--ink-soft); border-radius: var(--gb-radius); box-shadow: var(--gb-shadow-lg); padding: 14px 38px 14px 14px; margin: 0 0 12px; min-width: 300px; max-width: 380px; color: var(--ink); opacity: 1; } #wrapper.login #toasty-container .toasty::before { content: ""; flex: 0 0 34px; width: 34px; height: 34px; border-radius: 9px; background-repeat: no-repeat; background-position: center; background-size: 19px; } #wrapper.login #toasty-container .toasty-text { flex: 1; min-width: 0; } #wrapper.login #toasty-container .toasty-title { display: block; font-size: .9rem; font-weight: 700; color: var(--gb-navy); line-height: 1.35; } #wrapper.login #toasty-container .toasty-message { display: block; font-size: .8rem; color: var(--ink-soft); margin-top: 2px; line-height: 1.4; } #wrapper.login #toasty-container .toasty-message:empty { display: none; } #wrapper.login #toasty-container .toasty-close-button { position: absolute; top: 8px; right: 10px; border: none; background: none; cursor: pointer; font-size: 1.05rem; line-height: 1; color: #aab3bf; opacity: 1; text-shadow: none; font-weight: 700; } #wrapper.login #toasty-container .toasty-close-button:hover { color: var(--ink); } #wrapper.login #toasty-container .toasty-success { border-left-color: #1d9e75; } #wrapper.login #toasty-container .toasty-success::before { background-color: #e9f7f1; background-image: url(/Content/Styles/Common/data:image/svg+xml,%3Csvg xmlns='http:/www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231d9e75' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E); } #wrapper.login #toasty-container .toasty-error { border-left-color: var(--gb-red); } #wrapper.login #toasty-container .toasty-error::before { background-color: #fdecea; background-image: url(/Content/Styles/Common/data:image/svg+xml,%3Csvg xmlns='http:/www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e74c3c' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cline x1='12' y1='8' x2='12' y2='13'/%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'/%3E%3C/svg%3E); } #wrapper.login #toasty-container .toasty-warning { border-left-color: #e09b13; } #wrapper.login #toasty-container .toasty-warning::before { background-color: #fdf3e0; background-image: url(/Content/Styles/Common/data:image/svg+xml,%3Csvg xmlns='http:/www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e09b13' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z'/%3E%3Cline x1='12' y1='9' x2='12' y2='13'/%3E%3Cline x1='12' y1='17' x2='12.01' y2='17'/%3E%3C/svg%3E); } #wrapper.login #toasty-container .toasty-info { border-left-color: var(--gb-teal); } #wrapper.login #toasty-container .toasty-info::before { background-color: #e6f4f8; background-image: url(/Content/Styles/Common/data:image/svg+xml,%3Csvg xmlns='http:/www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236fbfd1' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cline x1='12' y1='11' x2='12' y2='16'/%3E%3Cline x1='12' y1='8' x2='12.01' y2='8'/%3E%3C/svg%3E); } #wrapper.login #box-border-form .termo-table { margin: 14px 0; } #wrapper.login #box-border-form .termo-table table { width: 100% !important; border-collapse: separate; border-spacing: 0; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; font-size: .84rem; } #wrapper.login #box-border-form .termo-table td, #wrapper.login #box-border-form .termo-table th { border: 0; border-bottom: 1px solid var(--line); border-right: 1px solid var(--line); padding: 9px 12px; vertical-align: top; text-align: left; } #wrapper.login #box-border-form .termo-table tr td:last-child { border-right: 0; } #wrapper.login #box-border-form .termo-table tr:last-child td { border-bottom: 0; } #wrapper.login #box-border-form .termo-table tr:first-child td { background: #eef6f9; font-weight: 700; color: var(--gb-navy); } #wrapper.login #box-border-form .termo-table tr:nth-child(even) td { background: #fafcfe; } /* resumo de erros (ng-summary) */ #wrapper.login ng-summary { display: block; } #wrapper.login ng-summary p { background: rgba(231,76,60,.08); border: 1px solid rgba(231,76,60,.3); color: #b5342a; border-radius: 10px; padding: 12px 16px; font-size: .84rem; margin-bottom: 14px; } /* ============================================================================ COMPONENTES DO PROTÓTIPO (cards, demonstrativo, downloads, campos) Reaproveitados nas telas Contracheque, Rendimentos e Alteração Cadastral. ========================================================================== */ #wrapper.login .ps-card { background: var(--surface); border: 1px solid var(--line-soft); border-radius: var(--gb-radius); box-shadow: var(--gb-shadow); } #wrapper.login .ps-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 20px; border-bottom: 1px solid var(--line-soft); } #wrapper.login .ps-card-title { font-size: .95rem; font-weight: 700; color: var(--gb-navy); } #wrapper.login .ps-card-head .ps-link { font-size: .78rem; color: var(--gb-teal); font-weight: 600; cursor: pointer; } #wrapper.login .ps-card-pad { padding: 18px 20px; } /* grade de 2 colunas (lista + detalhe) */ #wrapper.login .ps-grid-2 { display: grid; grid-template-columns: 1fr 1.2fr; gap: 20px; margin-top: 4px; } /* linha de download (informe) */ #wrapper.login .ps-dl { display: flex; align-items: center; gap: 14px; } #wrapper.login .ps-dl-ic { width: 42px; height: 42px; border-radius: 11px; background: rgba(111,191,209,.14); display: grid; place-items: center; flex-shrink: 0; } #wrapper.login .ps-dl-ic svg { width: 20px; height: 20px; stroke: #2f8fa6; stroke-width: 1.8; } #wrapper.login .ps-dl-meta { flex: 1; } #wrapper.login .ps-dl-meta .t { font-size: .9rem; font-weight: 700; color: var(--gb-navy); } #wrapper.login .ps-dl-meta .s { font-size: .76rem; color: var(--ink-soft); } /* ALTERAÇÃO CADASTRAL — seções (fieldset/legend) como cartões + colunas */ #wrapper.login #box-border-form fieldset { width: auto; max-width: 100%; background: var(--surface); border: 1px solid var(--line-soft); border-radius: var(--gb-radius); box-shadow: var(--gb-shadow); padding: 18px 22px; margin: 0 0 18px; } /* seções de 2 colunas (Informações, Certidão, Endereço...): grade robusta, sem sobreposição */ #wrapper.login #box-border-form fieldset:not(.section-four):not(.ps-grid12) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 26px; align-items: start; } #wrapper.login #box-border-form fieldset:not(.section-four):not(.ps-grid12) > legend { grid-column: 1 / -1; } #wrapper.login #box-border-form legend { width: auto; border: none; padding: 0 0 12px; margin: 0; font-size: .9rem; font-weight: 700; color: var(--gb-navy); text-transform: none; } /* ===== Grade de 12 colunas (disposição por usabilidade) ===== */ #wrapper.login #box-border-form fieldset.ps-grid12 { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 22px; align-items: start; } #wrapper.login #box-border-form fieldset.ps-grid12 > * { grid-column: span 12; } #wrapper.login #box-border-form fieldset.ps-grid12 > legend { grid-column: 1 / -1; } #wrapper.login #box-border-form fieldset.ps-grid12 > .col-2 { grid-column: span 2; } #wrapper.login #box-border-form fieldset.ps-grid12 > .col-3 { grid-column: span 3; } #wrapper.login #box-border-form fieldset.ps-grid12 > .col-4 { grid-column: span 4; } #wrapper.login #box-border-form fieldset.ps-grid12 > .col-6 { grid-column: span 6; } #wrapper.login #box-border-form fieldset.ps-grid12 > .col-8 { grid-column: span 8; } #wrapper.login #box-border-form fieldset.ps-grid12 > .col-12 { grid-column: span 12; } /* o .container-field interno nao adiciona margem lateral (a grade cuida do gap) */ #wrapper.login #box-border-form fieldset.ps-grid12 .container-field { margin-bottom: 14px; } @media (max-width: 760px) { #wrapper.login #box-border-form fieldset.ps-grid12 > * { grid-column: span 12 !important; } } /* widgets Kendo preenchem a largura do campo (evita transbordo/sobreposição) */ #wrapper.login #box-border-form .wrapper-field .k-widget { width: 100% !important; min-width: 0 !important; max-width: 100% !important; box-sizing: border-box; } /* indicador de obrigatório: troca a barra vermelha quadrada (controlls.css .obrigatorio) por um filete integrado à borda arredondada do próprio campo */ #wrapper.login #box-border-form .wrapper-field.obrigatorio { border-left: 0 !important; } #wrapper.login #box-border-form .wrapper-field.obrigatorio > input, #wrapper.login #box-border-form .wrapper-field.obrigatorio .k-dropdown .k-dropdown-wrap, #wrapper.login #box-border-form .wrapper-field.obrigatorio .k-datepicker .k-picker-wrap { border-left: 3px solid var(--gb-red) !important; } /* asterisco vermelho no rótulo do campo obrigatório (marcado pelo componente; sem :has, compatível com navegadores antigos) */ #wrapper.login #box-border-form .container-field label .req-mark { color: var(--gb-red); font-weight: 800; } /* mensagens de erro inline (ng-messages) harmonizadas com o tema */ #wrapper.login #box-border-form .mensagens, #wrapper.login #box-border-form .wrapper-field + [ng-messages], #wrapper.login #box-border-form .container-field > [ng-messages] { margin-top: 5px; } #wrapper.login #box-border-form span.error, #wrapper.login #box-border-form .error { display: inline-flex; align-items: flex-start; gap: 5px; background: none !important; color: var(--gb-red) !important; font-size: .72rem; font-weight: 600; line-height: 1.35; padding: 0; } #wrapper.login #box-border-form span.error::before { content: ""; flex: 0 0 13px; width: 13px; height: 13px; margin-top: 1px; background-image: url(/Content/Styles/Common/data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23e74c3c%27%20stroke-width%3D%272.2%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%2710%27%2F%3E%3Cline%20x1%3D%2712%27%20y1%3D%278%27%20x2%3D%2712%27%20y2%3D%2712%27%2F%3E%3Cline%20x1%3D%2712%27%20y1%3D%2716%27%20x2%3D%2712.01%27%20y2%3D%2716%27%2F%3E%3C%2Fsvg%3E); background-repeat: no-repeat; background-position: center; background-size: 13px; } @media (max-width: 680px) { #wrapper.login #box-border-form fieldset:not(.section-four):not(.ps-grid12) { grid-template-columns: 1fr; } } @media (max-width: 860px) { #wrapper.login .ps-grid-2 { grid-template-columns: 1fr; } } /* ============================================================================ CONTRACHEQUE — layout amigável (barra de seleção + cartões de resultado) Usa apenas os dados/ações já existentes (Competência, Tipo, Habilitação; Visualizar/Baixar PDF). Sem novo serviço. ========================================================================== */ #wrapper.login .ps-cc-toolbar { box-sizing: border-box; width: 100%; background: var(--surface); border: 1px solid var(--line-soft); border-radius: var(--gb-radius); box-shadow: var(--gb-shadow); padding: 18px 20px; margin-bottom: 22px; } #wrapper.login .ps-cc-t { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-soft); font-weight: 700; margin-bottom: 12px; } #wrapper.login .ps-cc-fields { display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-end; } #wrapper.login .ps-cc-field { flex: 1 1 200px; min-width: 160px; display: flex; flex-direction: column; } #wrapper.login .ps-cc-field > label { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-soft); font-weight: 700; margin-bottom: 5px; } #wrapper.login .ps-cc-buttons { display: flex; gap: 10px; flex: 0 0 auto; align-self: flex-end; } /* ---- Campos da barra: controle total da aparência (nativo OU Kendo) ---- O tema Kendo (PRONIM4-kendo.css) força height:26px, border-radius:0 e usa sprite no .k-i-arrow-s. Em vez de lutar contra cada regra, normalizamos o wrap por especificidade de ID + !important, escondemos a seta interna do Kendo e desenhamos UMA seta própria (triângulo CSS) no .ps-cc-field. Isso funciona igual para