/* Minification failed. Returning unminified contents. (2,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5156,39): run-time error CSS1046: Expect comma, found '0' (5156,43): run-time error CSS1046: Expect comma, found '/' (6623,40): run-time error CSS1034: (6623,40): run-time error CSS1042: Expected function, found ',' (6623,46): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')' (6743,35): run-time error CSS1046: Expect comma, found '0' (6743,39): run-time error CSS1046: Expect comma, found '/' (6743,65): run-time error CSS1046: Expect comma, found '0' (6743,69): run-time error CSS1046: Expect comma, found '/' (6743,97): run-time error CSS1046: Expect comma, found '0' (6743,101): run-time error CSS1046: Expect comma, found '/' (6914,21): run-time error CSS1039: Token not allowed after unary operator: '-bluePrimary' (6923,24): run-time error CSS1039: Token not allowed after unary operator: '-bluePrimary' (6974,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-border-2' (6975,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (7225,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7226,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7227,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7228,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7229,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7230,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7231,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7232,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7233,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7234,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7235,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7236,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7237,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7238,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7239,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7240,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7241,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7242,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7243,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7244,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7245,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7246,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7247,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7248,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7249,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7250,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7251,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7252,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7253,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7254,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7255,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7256,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7257,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7258,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7259,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (7276,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-text' (7277,21): run-time error CSS1039: Token not allowed after unary operator: '-size-md' (7296,23): run-time error CSS1039: Token not allowed after unary operator: '-font-bold' (7297,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-text' (7301,21): run-time error CSS1039: Token not allowed after unary operator: '-size-sm' (7306,21): run-time error CSS1039: Token not allowed after unary operator: '-size-sm' (7315,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-monto-a-pagar' (7319,21): run-time error CSS1039: Token not allowed after unary operator: '-clr-saldo-al-dia' (7323,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (7324,23): run-time error CSS1039: Token not allowed after unary operator: '-font-bold' (7337,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (7351,21): run-time error CSS1039: Token not allowed after unary operator: '-size-lg' (7353,23): run-time error CSS1039: Token not allowed after unary operator: '-font-bold' (7378,25): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (7386,20): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (7392,21): run-time error CSS1039: Token not allowed after unary operator: '-size-md' (7410,21): run-time error CSS1039: Token not allowed after unary operator: '-size-sm' (7415,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-primary' (7417,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-primary' (7432,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-primary' (7433,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-primary' (7438,32): run-time error CSS1039: Token not allowed after unary operator: '-clr-primary' (7439,32): run-time error CSS1039: Token not allowed after unary operator: '-clr-primary' (7470,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (7472,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (7522,27): run-time error CSS1039: Token not allowed after unary operator: '-font-bold' (7523,21): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (7536,25): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (7537,31): run-time error CSS1039: Token not allowed after unary operator: '-font-bold' (7544,36): run-time error CSS1039: Token not allowed after unary operator: '-size-md' (7545,29): run-time error CSS1039: Token not allowed after unary operator: '-size-md' (7550,32): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (7567,22): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (7602,25): run-time error CSS1039: Token not allowed after unary operator: '-clr-text' (7607,31): run-time error CSS1039: Token not allowed after unary operator: '-font-bold' (7610,36): run-time error CSS1039: Token not allowed after unary operator: '-clr-border' (7615,36): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (7627,15): run-time error CSS1039: Token not allowed after unary operator: '-size-md' (7636,17): run-time error CSS1039: Token not allowed after unary operator: '-size-md' (7638,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (7649,21): run-time error CSS1039: Token not allowed after unary operator: '-clr-text' (7650,25): run-time error CSS1039: Token not allowed after unary operator: '-size-sm' (7682,26): run-time error CSS1039: Token not allowed after unary operator: '-size-md' (7692,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-border' (7693,34): run-time error CSS1046: Expect comma, found '0' (7693,38): run-time error CSS1046: Expect comma, found '/' (7708,32): run-time error CSS1039: Token not allowed after unary operator: '-clr-border' (7710,29): run-time error CSS1039: Token not allowed after unary operator: '-size-md' (7717,21): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (7723,25): run-time error CSS1039: Token not allowed after unary operator: '-clr-text' (7724,29): run-time error CSS1039: Token not allowed after unary operator: '-size-sm' (7729,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (7739,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-text' (7761,33): run-time error CSS1039: Token not allowed after unary operator: '-size-sm' (7766,30): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (7767,31): run-time error CSS1039: Token not allowed after unary operator: '-font-bold' (7774,17): run-time error CSS1039: Token not allowed after unary operator: '-size-md' (7775,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-text' (7780,24): run-time error CSS1039: Token not allowed after unary operator: '-clr-saldo-a-pagar' (7792,22): run-time error CSS1039: Token not allowed after unary operator: '-clr-text' (7793,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-white' (7802,26): run-time error CSS1039: Token not allowed after unary operator: '-vel-trans' (7830,22): run-time error CSS1039: Token not allowed after unary operator: '-clr-text' (7834,26): run-time error CSS1039: Token not allowed after unary operator: '-vel-trans' (7876,15): run-time error CSS1039: Token not allowed after unary operator: '-lupaTooltipTop' (7877,16): run-time error CSS1039: Token not allowed after unary operator: '-lupaTooltipLeft' (7883,21): run-time error CSS1039: Token not allowed after unary operator: '-size-md' (7906,45): run-time error CSS1039: Token not allowed after unary operator: '-lupaLeft' (7906,61): run-time error CSS1039: Token not allowed after unary operator: '-lupaTop' (7906,106): run-time error CSS1039: Token not allowed after unary operator: '-lupaSize' (7906,124): run-time error CSS1046: Expect comma, found '0' (7906,128): run-time error CSS1046: Expect comma, found '/' (7910,40): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (7951,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-white' (7955,16): run-time error CSS1039: Token not allowed after unary operator: '-clr-white' (8070,25): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (8098,32): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (8099,32): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (8211,32): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (8212,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (8404,23): run-time error CSS1046: Expect comma, found '0' (8404,27): run-time error CSS1046: Expect comma, found '/' (8454,25): run-time error CSS1039: Token not allowed after unary operator: '-clr-title-richtext' (8859,40): run-time error CSS1046: Expect comma, found '42' (8859,46): run-time error CSS1046: Expect comma, found '/' (8860,41): run-time error CSS1046: Expect comma, found '0' (8860,45): run-time error CSS1046: Expect comma, found '/' (8989,36): run-time error CSS1046: Expect comma, found '42' (8989,42): run-time error CSS1046: Expect comma, found '/' (8997,21): run-time error CSS1039: Token not allowed after unary operator: '-clr-text' (9703,15): run-time error CSS1039: Token not allowed after unary operator: '-lupaOnboardingTooltipTop' (9704,16): run-time error CSS1039: Token not allowed after unary operator: '-lupaOnboardingTooltipLeft' (9710,21): run-time error CSS1039: Token not allowed after unary operator: '-size-md' (9782,22): run-time error CSS1039: Token not allowed after unary operator: '-clr-white' (9823,30): run-time error CSS1039: Token not allowed after unary operator: '-bg-noti' (9828,25): run-time error CSS1039: Token not allowed after unary operator: '-clr-white' (9927,19): run-time error CSS1039: Token not allowed after unary operator: '-size-md' (9943,28): run-time error CSS1039: Token not allowed after unary operator: '-size-md' (10154,15): run-time error CSS1039: Token not allowed after unary operator: '-size-md' (10157,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-text' (10158,22): run-time error CSS1039: Token not allowed after unary operator: '-vel-trans' (10367,21): run-time error CSS1039: Token not allowed after unary operator: '-size-lg' (10368,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-white' (10380,24): run-time error CSS1039: Token not allowed after unary operator: '-clr-white' (10388,22): run-time error CSS1039: Token not allowed after unary operator: '-clr-white' (10389,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (10391,34): run-time error CSS1046: Expect comma, found '0' (10391,38): run-time error CSS1046: Expect comma, found '/' (10392,22): run-time error CSS1039: Token not allowed after unary operator: '-vel-trans' (10398,35): run-time error CSS1039: Token not allowed after unary operator: '-height-header' (10399,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-border' (10421,36): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (10429,25): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (10436,25): run-time error CSS1039: Token not allowed after unary operator: '-clr-white' (10440,25): run-time error CSS1039: Token not allowed after unary operator: '-size-lg' (10446,25): run-time error CSS1039: Token not allowed after unary operator: '-size-lg' (10451,24): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (10456,24): run-time error CSS1039: Token not allowed after unary operator: '-clr-white' (10466,32): run-time error CSS1039: Token not allowed after unary operator: '-size-md' (10467,31): run-time error CSS1039: Token not allowed after unary operator: '-font-bold' (10488,22): run-time error CSS1039: Token not allowed after unary operator: '-clr-white' (10489,25): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (10490,22): run-time error CSS1039: Token not allowed after unary operator: '-vel-trans' (10498,34): run-time error CSS1046: Expect comma, found '0' (10498,38): run-time error CSS1046: Expect comma, found '/' (10515,29): run-time error CSS1039: Token not allowed after unary operator: '-border-radius' (10517,29): run-time error CSS1039: Token not allowed after unary operator: '-size-md' (10534,21): run-time error CSS1039: Token not allowed after unary operator: '-clr-text' (10535,25): run-time error CSS1039: Token not allowed after unary operator: '-size-sm' (10540,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (10551,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-text' (10621,21): run-time error CSS1039: Token not allowed after unary operator: '-size-lg' (10689,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-white' (10826,21): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (10903,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (10963,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-blue-movistar' (11043,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11044,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11045,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11046,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11047,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11048,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11049,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11050,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11051,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11052,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11053,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11054,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11055,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11056,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11057,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11083,25): run-time error CSS1039: Token not allowed after unary operator: '-textPrimary' (11087,31): run-time error CSS1039: Token not allowed after unary operator: '-fontBase' (11090,25): run-time error CSS1039: Token not allowed after unary operator: '-textSecondary' (11094,25): run-time error CSS1039: Token not allowed after unary operator: '-textPrimary' (11111,27): run-time error CSS1039: Token not allowed after unary operator: '-fontBase' (11114,32): run-time error CSS1039: Token not allowed after unary operator: '-whiteB2B' (11115,32): run-time error CSS1039: Token not allowed after unary operator: '-borderColorB2B' (11118,26): run-time error CSS1039: Token not allowed after unary operator: '-velTransition' (11124,32): run-time error CSS1039: Token not allowed after unary operator: '-skyBlueB2B' (11125,28): run-time error CSS1039: Token not allowed after unary operator: '-blueB2B' (11126,21): run-time error CSS1039: Token not allowed after unary operator: '-blueB2B' (11130,32): run-time error CSS1039: Token not allowed after unary operator: '-skyBlueB2B' (11131,28): run-time error CSS1039: Token not allowed after unary operator: '-skyBlueB2B' (11132,21): run-time error CSS1039: Token not allowed after unary operator: '-blueB2B' (11148,22): run-time error CSS1039: Token not allowed after unary operator: '-velTransition' (11156,27): run-time error CSS1039: Token not allowed after unary operator: '-fontBase' (11187,26): run-time error CSS1039: Token not allowed after unary operator: '-whiteB2B' (11242,32): run-time error CSS1039: Token not allowed after unary operator: '-textLink' (11243,32): run-time error CSS1039: Token not allowed after unary operator: '-textLink' (11244,21): run-time error CSS1039: Token not allowed after unary operator: '-whiteB2B' (11249,24): run-time error CSS1039: Token not allowed after unary operator: '-whiteB2B' (11253,25): run-time error CSS1039: Token not allowed after unary operator: '-whiteB2B' (11257,25): run-time error CSS1039: Token not allowed after unary operator: '-blueB2B' (11262,25): run-time error CSS1039: Token not allowed after unary operator: '-blueB2B' (11268,36): run-time error CSS1039: Token not allowed after unary operator: '-skyBlueB2B' (11269,25): run-time error CSS1039: Token not allowed after unary operator: '-blueB2B' (11276,32): run-time error CSS1039: Token not allowed after unary operator: '-skyBlueB2B' (11282,28): run-time error CSS1039: Token not allowed after unary operator: '-blueB2B' (11286,30): run-time error CSS1039: Token not allowed after unary operator: '-textLink' (11290,32): run-time error CSS1039: Token not allowed after unary operator: '-whiteB2B' (11291,21): run-time error CSS1039: Token not allowed after unary operator: '-textLink' (11292,34): run-time error CSS1039: Token not allowed after unary operator: '-textLink' (11297,25): run-time error CSS1039: Token not allowed after unary operator: '-blueB2B' (11301,25): run-time error CSS1039: Token not allowed after unary operator: '-whiteB2B' (11305,36): run-time error CSS1039: Token not allowed after unary operator: '-blueB2B' (11306,25): run-time error CSS1039: Token not allowed after unary operator: '-whiteB2B' (11310,32): run-time error CSS1039: Token not allowed after unary operator: '-blueB2B' (11311,25): run-time error CSS1039: Token not allowed after unary operator: '-blueB2B' (11312,36): run-time error CSS1039: Token not allowed after unary operator: '-whiteB2B' (11316,24): run-time error CSS1039: Token not allowed after unary operator: '-whiteB2B' (11320,24): run-time error CSS1039: Token not allowed after unary operator: '-blueB2B' (11332,28): run-time error CSS1039: Token not allowed after unary operator: '-whiteB2B' (11333,28): run-time error CSS1039: Token not allowed after unary operator: '-borderColorB2B' (11340,27): run-time error CSS1039: Token not allowed after unary operator: '-fontBase' (11350,21): run-time error CSS1039: Token not allowed after unary operator: '-textPrimary' (11366,26): run-time error CSS1039: Token not allowed after unary operator: '-velTransition' (11388,21): run-time error CSS1039: Token not allowed after unary operator: '-textSecondary' (11424,27): run-time error CSS1039: Token not allowed after unary operator: '-fontBase' (11430,21): run-time error CSS1039: Token not allowed after unary operator: '-textSecondary' (11435,25): run-time error CSS1039: Token not allowed after unary operator: '-textError' (11445,32): run-time error CSS1039: Token not allowed after unary operator: '-whiteB2B' (11446,32): run-time error CSS1039: Token not allowed after unary operator: '-borderColorB2B' (11459,29): run-time error CSS1039: Token not allowed after unary operator: '-grayB2B' (11465,30): run-time error CSS1039: Token not allowed after unary operator: '-whiteB2B' (11476,47): run-time error CSS1039: Token not allowed after unary operator: '-borderBottomColorB2B' (11501,37): run-time error CSS1039: Token not allowed after unary operator: '-grayB2B' (11507,41): run-time error CSS1039: Token not allowed after unary operator: '-textSecondary' (11511,47): run-time error CSS1039: Token not allowed after unary operator: '-fontWeightBolder' (11512,41): run-time error CSS1039: Token not allowed after unary operator: '-highlightsB2B' (11522,25): run-time error CSS1039: Token not allowed after unary operator: '-textLink' (11535,27): run-time error CSS1039: Token not allowed after unary operator: '-fontBase' (11543,21): run-time error CSS1039: Token not allowed after unary operator: '-textPrimary' (11544,32): run-time error CSS1039: Token not allowed after unary operator: '-borderColorB2B_2' (11546,26): run-time error CSS1039: Token not allowed after unary operator: '-whiteB2B' (11549,26): run-time error CSS1039: Token not allowed after unary operator: '-velTransition' (11559,26): run-time error CSS1039: Token not allowed after unary operator: '-velTransition' (11565,21): run-time error CSS1039: Token not allowed after unary operator: '-textSecondary' (11575,26): run-time error CSS1039: Token not allowed after unary operator: '-whiteB2B' (11584,32): run-time error CSS1039: Token not allowed after unary operator: '-borderColorB2B_2' (11599,29): run-time error CSS1039: Token not allowed after unary operator: '-textSecondary' (11608,47): run-time error CSS1039: Token not allowed after unary operator: '-borderBottomColorB2B' (11645,38): run-time error CSS1039: Token not allowed after unary operator: '-whiteB2B' (11648,49): run-time error CSS1039: Token not allowed after unary operator: '-borderBottomColorB2B' (11649,51): run-time error CSS1039: Token not allowed after unary operator: '-borderBottomColorB2B' (11675,37): run-time error CSS1039: Token not allowed after unary operator: '-textSecondary' (11679,41): run-time error CSS1039: Token not allowed after unary operator: '-textPrimary' (11712,27): run-time error CSS1039: Token not allowed after unary operator: '-fontBase' (11716,21): run-time error CSS1039: Token not allowed after unary operator: '-textPrimary' (11721,25): run-time error CSS1039: Token not allowed after unary operator: '-textError' (11727,32): run-time error CSS1039: Token not allowed after unary operator: '-borderColorB2B' (11743,21): run-time error CSS1039: Token not allowed after unary operator: '-textSecondary' (11753,28): run-time error CSS1039: Token not allowed after unary operator: '-borderColorB2B' (11760,27): run-time error CSS1039: Token not allowed after unary operator: '-fontBase' */ :root { --blueMovistar: #019DF4; --bluePrimary: #007ACD } *, *::before, *::after { -webkit-box-sizing: border-box; box-sizing: border-box; } * { margin: 0; padding: 0; font-family: 'TelefonicaLight'; } body { color: #50535a; font-size: 16px; } ::-webkit-scrollbar { width: 15px; margin-left: 20px; } ::-webkit-scrollbar-track { box-shadow: inset 0 0 5px grey; background: #f8f8f8; border-radius: 10px; } ::-webkit-scrollbar-thumb { background: #7777774f; border-radius: 10px; } #spinner { position: absolute; display: flex; justify-content: center; align-items: center; width: 100%; margin: 3% auto; background: white; } h1, h2, h3, h4 { font-family: "TelefonicaLight", sans-serif; font-weight: 300; } .btn-enviar::after { content: "\f48a"; position: relative; width: auto; height: auto; margin-left: 5px; font-family: "Material Design Icons"; font-size: 20px; top: 2px; } .btn-adjuntar::before { content: "\f3e2"; position: relative; width: auto; height: auto; margin-right: 5px; font-family: "Material Design Icons"; font-size: 20px; top: 2px; } .navbar-movistar { background-color: #ffffff !important; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .sub-header { -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14) !important; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14) !important; background-color: #ffffff !important; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; z-index: 1; } @media (min-width: 768px) { .bd-sidebar, .bd-toc { top: 80px !important; max-height: calc(100vh - 80px) !important; } } .nav-top-right { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .nav-top-left { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; margin-left: 80px; } .nav-top-left nav a:link, .nav-top-left nav a:visited { color: #50535a; font-family: "TelefonicaLight", sans-serif; font-size: 16px; margin: 0 45px 0 0; } .nav-top-left nav a:link.active, .nav-top-left nav a:visited.active { color: #007aa2; font-family: "TelefonicaBold", sans-serif; } .nav-top-left nav a:hover, .nav-top-left nav a:active { color: #007aa2; text-decoration: none; } .nav-top-left nav a:hover .active, .nav-top-left nav a:active .active { color: #007aa2; font-family: "TelefonicaBold", sans-serif; } .nav-top-left .top-user { color: #50535a; font-family: "TelefonicaLight", sans-serif; font-size: 16px; margin: 0 10px; } .nav-top-left .top-user i { color: #007aa2; } .desplegable .dropdown-toggle { -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: inherit; border: none; color: #50535a; cursor: pointer; display: -webkit-box; display: -ms-flexbox; display: flex; font-family: "TelefonicaLight", sans-serif; font-size: 18px; padding: 0 15px 0 15px; outline: none; } .desplegable .dropdown-toggle::after { color: #007aa2; display: inline-block; width: auto; height: auto; margin-top: 5px; content: "\f140"; font-family: "Material Design Icons"; font-size: 24px; border: none; } .desplegable .dropdown-menu { min-width: 200px; border-radius: 8px; -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2); } .desplegable .dropdown-menu nav span { display: inline-block; font-family: "TelefonicaBold", sans-serif; font-size: 12px; color: #50535a; padding: 5px 15px; } .desplegable .dropdown-menu nav a:link, .desplegable .dropdown-menu nav a:visited { color: #50535a; display: block; font-family: "TelefonicaLight", sans-serif; font-size: 16px; padding: 7px 35px 7px 15px; } .desplegable .dropdown-menu nav a:link::before, .desplegable .dropdown-menu nav a:visited::before { content: ""; display: inline-block; font-family: "Material Design Icons"; font-size: 20px; margin-right: 5px; width: 20px; } .desplegable .dropdown-menu nav a:hover, .desplegable .dropdown-menu nav a:active { background-color: #f4f4f3; text-decoration: none; } .desplegable .dropdown-menu nav a.active::before { content: "\f12c"; } .custom-select { width: 100%; height: 48px; padding: 0 40px 0 20px; line-height: 1.5; color: #3b3d43; vertical-align: middle; background: #e9eae8; background-image: url(/Content/assets/img/chevron-down.svg); background-position: calc(100% - 15px) center; background-repeat: no-repeat; background-clip: padding-box; border: 1px solid rgba(0, 0, 0, 0); } #filtroClasificacion.custom-select option, #cmbClasificacion.custom-select option { font-weight: bold; } .custom-select:active, .custom-select:focus { outline: none; -webkit-box-shadow: inherit; box-shadow: inherit; border-color: #e9eae8; background-color: #f8f8f8; } .filtros-holder { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-color: #f8f8f8; } .filtros-holder.space-between { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .filtros { background-color: #f8f8f8; padding: 12.5px 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; min-height: 69px; } .filtros .select-date a { font-size: 24px; color: #50535a; display: inline-block; padding: 0 13px; } .filtros .btn-group { padding-left: 5px; } .filtros .btn-group .dropdown-toggle { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 0 15px 0 15px; cursor: pointer; } .filtros .btn-group .dropdown-toggle::after { display: inline-block; width: auto; height: auto; margin-left: 0.255em; vertical-align: 0.255em; content: "\f140"; font-family: "Material Design Icons"; font-size: 24px; border: none; } .filtros .btn-group .dropdown-menu { min-width: 200px; border-radius: 8px; -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2); } .filtros .btn-group .dropdown-menu nav span { display: inline-block; font-family: "TelefonicaBold", sans-serif; font-size: 12px; color: #50535a; padding: 5px 15px; } .filtros .btn-group .dropdown-menu nav a:link, .filtros .btn-group .dropdown-menu nav a:visited { color: #50535a; display: block; font-family: "TelefonicaLight", sans-serif; font-size: 16px; padding: 7px 35px 7px 15px; } .filtros .btn-group .dropdown-menu nav a:link::before, .filtros .btn-group .dropdown-menu nav a:visited::before { content: ""; display: inline-block; font-family: "Material Design Icons"; font-size: 20px; margin-right: 5px; width: 20px; } .filtros .btn-group .dropdown-menu nav a:hover, .filtros .btn-group .dropdown-menu nav a:active { background-color: #f4f4f3; text-decoration: none; } .filtros .btn-group .dropdown-menu nav a.active::before { content: "\f12c"; } .filtros .btn-group-check { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .filtros .btn-group-check .dropdown-toggle { padding: 0 15px 0 0; } .filtros .btn-group-check .dropdown-menu { left: -18px !important; } .border-top { border-top: 1px solid #d3d4d3; } .border-top-200 { border-top: 1px solid #e9eae8; } .border-right { border-right: 1px solid #d3d4d3; } .border-bottom { border-bottom: 1px solid #d3d4d3; } .border-left { border-left: 1px solid #d3d4d3; } .left-menu .filtros { min-height: 70px; } .left-menu nav a { -webkit-box-align: center; -ms-flex-align: center; align-items: center; border-left: 5px solid rgba(0, 0, 0, 0); display: -webkit-box; display: -ms-flexbox; display: flex; font-family: "TelefonicaLight", sans-serif; font-size: 15px; color: rgb(80, 83, 90); padding: 17px 10px 17px 20px; -webkit-transition: all 0.25s ease-in; transition: all 0.25s ease-in; } .left-menu nav a:link, .left-menu nav a:visited { color: #b6b7b7; } .left-menu nav a:hover, .left-menu nav a:active { background-color: #f8f8f8; color: #50535a; text-decoration: none; } .left-menu nav a::before { content: "\F12D"; display: inline-block; font-family: "Material Design Icons"; font-size: 24px; text-rendering: auto; line-height: inherit; -webkit-font-smoothing: antialiased; margin-right: 20px; } .left-menu nav a span:first-child { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .left-menu nav a .badge { border-radius: 10px; font-family: "TelefonicaLight", sans-serif; font-size: 14px; min-width: 25px; min-height: 25px; line-height: 22px; padding: 0 5px; background-color: #f4f4f3; } .left-menu nav a .badge.badge-light { color: #000000; } .left-menu nav a.active { background-color: #f8f8f8; border-left: 5px solid #5bc500; color: #3b3d43; } .left-menu nav a.active .badge { background-color: #007aa2; color: #ffffff; } .left-menu nav a:first-child::before { color: #007aa2; } .left-menu nav a.tab-enresolucion::before { content: "\F12D"; } .left-menu nav a.tab-abiertas::before { content: "\f12c"; } .left-menu nav a.tab-canceladas::before { content: "\f156"; } .left-menu nav a.tab-destacadas::before { content: "\f4ce"; color: #f59c00; } .left-menu nav a.tab-noleidas::before { content: "\f764"; } .left-menu nav a.tab-todas::before { content: "\f256"; } .left-menu nav a.tab-habilitadas::before { content: "\f5e0"; color: #5bc500; } .left-menu nav a.tab-suspendidas::before { content: "\f697"; color: #ec6839; } .left-menu nav a.tab-enmora::before { content: url(/Content/assets/img/icon-suspendidas-mora.svg); } .left-menu nav a.tab-porvencer::before { content: url(/Content/assets/img/icon-por_vencer.svg); } .left-menu nav a.tab-excedidas::before { content: url(/Content/assets/img/icon-suspendidas-excedidas.svg); } .left-menu nav a.tab-sinactividad::before { content: "\f224"; color: #007aa2; } .left-menu nav a.tab-equipono::before { content: "\fb18"; color: #f59c00; } .left-menu nav a.tab-roaming::before { content: url(/Content/assets/img/icon-roaming-activado.svg); } .left-menu nav a.tab-ddn::before { content: url(/Content/assets/img/icon-DDN-DDI-activado.svg); } .left-menu nav a.drop span:first-child { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .left-menu nav a.drop span:first-child::after { content: "\f140"; display: inline-block; position: relative; top: 2px; font-family: "Material Design Icons"; font-size: 20px; text-rendering: auto; line-height: inherit; -webkit-font-smoothing: antialiased; } .left-menu nav a.drop.drop-active span:first-child::after { content: "\f143"; } .left-menu .drop-nav { background-color: #f8f8f8; display: none; } .left-menu .drop-nav a { padding-left: 60px; } .items-update { background-color: rgba(245, 156, 0, 0.2); border-top: 1px solid rgba(245, 156, 0, 0.5); border-bottom: 1px solid rgba(245, 156, 0, 0.5); text-align: center; font-family: "TelefonicaLight", sans-serif; font-size: 14px; color: #50535a; min-height: 40px; line-height: 40px; } .items-update p { margin: 0; padding: 0; } .items-resultados { background-color: #f8f8f8; border-top: 1px solid #d3d4d3; border-bottom: 1px solid #d3d4d3; font-family: "TelefonicaLight", sans-serif; font-size: 24px; color: #50535a; min-height: 70px; line-height: 70px; padding: 0 20px; } .items-resultados p { margin: 0; padding: 0; } .items-resultados.cat { font-size: 18px; font-family: "TelefonicaBold", sans-serif; } .items-ver-mas { background-color: #f8f8f8; padding: 20px 0; text-align: center; font-size: 16px; } .items-holder .item { background-color: #f8f8f8; border-bottom: 1px solid #d3d4d3; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; padding: 15px 10px; cursor: pointer; border-left: 5px solid rgba(0, 0, 0, 0); -webkit-transition: all 0.25s ease-in; transition: all 0.25s ease-in; } .items-holder .item .item-check { padding: 3px 5px 0; } .items-holder .item .item-star { padding: 0 5px; } .items-holder .item .item-star a { display: block; } .items-holder .item .item-star a::before { content: "\f4d2"; display: inline-block; font-family: "Material Design Icons"; font-size: 22px; text-rendering: auto; line-height: inherit; -webkit-font-smoothing: antialiased; } .items-holder .item .item-star a:link, .items-holder .item .item-star a:visited { color: #86888c; } .items-holder .item .item-star a:hover, .items-holder .item .item-star a:active { color: #50535a; } .items-holder .item .item-star a.starred { color: #f59c00; } .items-holder .item .item-star a.starred::before { content: "\f4ce"; } .items-holder .item .item-text { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding: 4px 5px 0; } .items-holder .item .item-text h3, .rz-ticket { color: #5c5c5c; font-family: "TelefonicaLight", sans-serif; font-size: 16px; margin: 0; padding: 0; } .items-holder .item .item-text h3 span { font-family: "TelefonicaLight", sans-serif; } .items-holder .item .item-text h3 .font-light { color: #86888c; } .items-holder .item .item-text p { font-family: "TelefonicaLight", sans-serif; font-size: 16px; color: #86888c; line-height: 1.4; margin: 0; padding: 0; } .items-holder .item .item-text p span, .items-holder .item .item-text p strong { color: #50535a; } .items-holder .item .item-info { font-size: 12px; padding: 0 5px 0 15px; text-align: right; } .items-holder .item .item-info .time { color: #007aa2; font-family: "TelefonicaBold", sans-serif; } .items-holder .item .item-info .user-by { color: #50535a; font-family: "TelefonicaLight", sans-serif; } .items-holder .item .item-info .user-by span { display: block; } .items-holder .item .item-info .tag { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .items-holder .item .item-info .tag span { color: #b6b7b7; font-size: 20px; } .items-holder .item .item-info .tag span:first-child { display: inline-block; background-color: #5bc500; color: #ffffff; font-family: "TelefonicaLight", sans-serif; font-size: 12px; padding: 1px 4px; border-radius: 2px; margin-right: 5px; } .items-holder .item .item-icons { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-line-pack: center; align-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .items-holder .item .item-icons .i-icon { display: inline-block; font-size: 22px; padding: 0 2px; } .items-holder .item .item-icons .i-icon.icon-excedidas { margin-top: -2px; } .items-holder .item .item-icons .i-icon.icon-mora { padding-top: 1px; } .items-holder .item .item-icons .i-icon.icon-nooriginal { color: #f59c00; } .items-holder .item .item-icons .i-icon.icon-sinactividad { color: #007aa2; } .items-holder .item .item-arrows .mdi { font-size: 22px; } .items-holder .item .item-arrows .mdi-chevron-up { display: none; } .items-holder .item:hover { background-color: whitesmoke; } .items-holder .item.item-new .item-text h3 { color: #50535a; font-family: "TelefonicaBold", sans-serif; } .items-holder .item.item-new .item-text h3 .user-ani, .items-holder .item.item-new .item-text h3 .user-cliente, .items-holder .item.item-new .item-text h3 .user-cuit { font-family: "TelefonicaBold", sans-serif; } .items-holder .item.item-new .item-text p span, .items-holder .item.item-new .item-text p strong { color: #50535a; } .items-holder .item.item-active { background-color: #ffffff; border-left: 5px solid #5bc500; -webkit-box-shadow: -1px 2px 5px 0 rgba(0, 0, 0, 0.1); box-shadow: -1px 2px 5px 0 rgba(0, 0, 0, 0.1); z-index: 1; position: relative; } .items-holder .item.item-active .item-text h3, .item.item-active .rz-ticket { color: #50535a; font-family: "TelefonicaBold", sans-serif; } .items-holder .item.item-active .item-text p span, .items-holder .item.item-active .item-text p strong { color: #50535a; } .items-holder .item.item-desplegable-active { background-color: #ffffff; border-left: 5px solid #5bc500; -webkit-box-shadow: -1px 2px 5px 0 rgba(0, 0, 0, 0.1); box-shadow: -1px 2px 5px 0 rgba(0, 0, 0, 0.1); z-index: 1; position: relative; } .items-holder .item.item-desplegable-active .item-text h3 { color: #50535a; font-family: "TelefonicaBold", sans-serif; } .items-holder .item.item-desplegable-active .item-text p span, .items-holder .item.item-desplegable-active .item-text p strong { color: #50535a; } .items-holder .item-desplegable-holder { display: none; } .items-holder .item-desplegable-holder .item { padding-left: 70px; border-left: 5px solid #979797; } .items-holder .item-desplegable-holder .item.item-active { border-left: 5px solid #5bc500; } .items-holderl .item { background-color: #f8f8f8; border-bottom: 1px solid #d3d4d3; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; padding: 15px 10px; cursor: pointer; border-left: 5px solid rgba(0, 0, 0, 0); -webkit-transition: all 0.25s ease-in; transition: all 0.25s ease-in; } .items-holderl .item .item-check { padding: 3px 5px 0; } .items-holderl .item .item-star { padding: 0 5px; } .items-holderl .item .item-star a { display: block; } .items-holderl .item .item-star a::before { content: "\f4d2"; display: inline-block; font-family: "Material Design Icons"; font-size: 22px; text-rendering: auto; line-height: inherit; -webkit-font-smoothing: antialiased; } .items-holderl .item .item-star a:link, .items-holder .item .item-star a:visited { color: #86888c; } .items-holderl .item .item-star a:hover, .items-holder .item .item-star a:active { color: #50535a; } .items-holderl .item .item-star a.starred { color: #f59c00; } .items-holderl .item .item-star a.starred::before { content: "\f4ce"; } .items-holderl .item .item-text { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding: 4px 5px 0; } .items-holderl .item .item-text h3 { color: #86888c; font-family: "TelefonicaLight", sans-serif; font-size: 16px; margin: 0; padding: 0; } .items-holderl .item .item-text h3 span { font-family: "TelefonicaLight", sans-serif; } .items-holderl .item .item-text h3 .font-light { color: #86888c; } .items-holderl .item .item-text p { font-family: "TelefonicaLight", sans-serif; font-size: 16px; color: #86888c; line-height: 1.4; margin: 0; padding: 0; } .items-holderl .item .item-text p span, .items-holder .item .item-text p strong { color: #50535a; } .items-holderl .item .item-info { font-size: 12px; padding: 0 5px 0 15px; text-align: right; } .items-holderl .item .item-info .time { color: #007aa2; font-family: "TelefonicaBold", sans-serif; } .items-holderl .item .item-info .user-by { color: #86888c; font-family: "TelefonicaLight", sans-serif; } .items-holderl .item .item-info .user-by span { display: block; } .items-holderl .item .item-info .tag { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .items-holderl .item .item-info .tag span { color: #b6b7b7; font-size: 20px; } .items-holderl .item .item-info .tag span:first-child { display: inline-block; background-color: #5bc500; color: #ffffff; font-family: "TelefonicaLight", sans-serif; font-size: 12px; padding: 1px 4px; border-radius: 2px; margin-right: 5px; } .items-holderl .item .item-icons { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-line-pack: center; align-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .items-holderl .item .item-icons .i-icon { display: inline-block; font-size: 22px; padding: 0 2px; } .items-holderl .item .item-icons .i-icon.icon-excedidas { margin-top: -2px; } .items-holderl .item .item-icons .i-icon.icon-mora { padding-top: 1px; } .items-holderl .item .item-icons .i-icon.icon-nooriginal { color: #f59c00; } .items-holderl .item .item-icons .i-icon.icon-sinactividad { color: #007aa2; } .items-holderl .item .item-arrows .mdi { font-size: 22px; } .items-holderl .item .item-arrows .mdi-chevron-up { display: none; } .items-holderl .item:hover { background-color: whitesmoke; } .items-holderl .item.item-new .item-text h3 { color: #50535a; font-family: "TelefonicaBold", sans-serif; } .items-holderl .item.item-new .item-text h3 .user-ani, .items-holder .item.item-new .item-text h3 .user-cliente, .items-holder .item.item-new .item-text h3 .user-cuit { font-family: "TelefonicaBold", sans-serif; } .items-holderl .item.item-new .item-text p span, .items-holder .item.item-new .item-text p strong { color: #50535a; } .items-holderl .item.item-active { background-color: #ffffff; border-left: 5px solid #5bc500; -webkit-box-shadow: -1px 2px 5px 0 rgba(0, 0, 0, 0.1); box-shadow: -1px 2px 5px 0 rgba(0, 0, 0, 0.1); z-index: 1; position: relative; } .items-holderl .item.item-active .item-text h3 { color: #50535a; font-family: "TelefonicaBold", sans-serif; } .items-holderl .item.item-active .item-text p span, .items-holderl .item.item-active .item-text p strong { color: #50535a; } .items-holderl .item.item-desplegable-active { background-color: #ffffff; border-left: 5px solid #5bc500; -webkit-box-shadow: -1px 2px 5px 0 rgba(0, 0, 0, 0.1); box-shadow: -1px 2px 5px 0 rgba(0, 0, 0, 0.1); z-index: 1; position: relative; } .items-holderl .item.item-desplegable-active .item-text h3 { color: #50535a; font-family: "TelefonicaBold", sans-serif; } .items-holderl .item.item-desplegable-active .item-text p span, .items-holderl .item.item-desplegable-active .item-text p strong { color: #50535a; } .items-holderl .item-desplegable-holder { display: none; } .items-holderl .item-desplegable-holder .item { padding-left: 70px; border-left: 5px solid #979797; } .items-holderl .item-desplegable-holder .item.item-active { border-left: 5px solid #5bc500; } .items-holderf .item, .items-cuentas-mp .item { background-color: #f8f8f8; border-bottom: 1px solid #d3d4d3; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; padding: 15px 10px; cursor: pointer; border-left: 5px solid rgba(0, 0, 0, 0); -webkit-transition: all 0.25s ease-in; transition: all 0.25s ease-in; } .items-holderf .item .item-check { padding: 3px 5px 0; } .items-holderf .item .item-star { padding: 0 5px; } .items-holderf .item .item-star a { display: block; } .items-holderf .item .item-star a::before { content: "\f4d2"; display: inline-block; font-family: "Material Design Icons"; font-size: 22px; text-rendering: auto; line-height: inherit; -webkit-font-smoothing: antialiased; } .items-holderf .item .item-star a:link, .items-holder .item .item-star a:visited { color: #86888c; } .items-holderf .item .item-star a:hover, .items-holder .item .item-star a:active { color: #50535a; } .items-holderf .item .item-star a.starred { color: #f59c00; } .items-holderf .item .item-star a.starred::before { content: "\f4ce"; } .items-holderf .item .item-text, .items-cuentas-mp .item .item-text { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding: 4px 5px 0; } .items-holderf .item .item-text h3, .items-cuentas-mp .item .item-text h3 { color: #696969; font-family: "TelefonicaLight", sans-serif; font-size: 16px; margin: 0; padding: 0; font-weight: 400; } .items-holderf .item .item-text h3 span { font-family: "TelefonicaLight", sans-serif; } .items-holderf .item .item-text h3 .font-light { color: #86888c; } .items-holderf .item .item-text p { font-family: "TelefonicaLight", sans-serif; font-size: 16px; color: #86888c; line-height: 1.4; margin: 0; padding: 0; } .items-holderf .item .item-text p span, .items-holder .item .item-text p strong { color: #50535a; } .items-holderf .item .item-info { font-size: 12px; padding: 0 5px 0 15px; text-align: right; } .items-holderf .item .item-info .time { color: #007aa2; font-family: "TelefonicaBold", sans-serif; } .items-holderf .item .item-info .user-by { color: #86888c; font-family: "TelefonicaLight", sans-serif; } .items-holderf .item .item-info .user-by span { display: block; } .items-holderf .item .item-info .tag { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .items-holderf .item .item-info .tag span { color: #b6b7b7; font-size: 20px; } .items-holderf .item .item-info .tag span:first-child { display: inline-block; background-color: #5bc500; color: #ffffff; font-family: "TelefonicaLight", sans-serif; font-size: 12px; padding: 1px 4px; border-radius: 2px; margin-right: 5px; } .items-holderf .item .item-icons { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-line-pack: center; align-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .items-holderf .item .item-icons .i-icon { display: inline-block; font-size: 22px; padding: 0 2px; } .items-holderf .item .item-icons .i-icon.icon-excedidas { margin-top: -2px; } .items-holderf .item .item-icons .i-icon.icon-mora { padding-top: 1px; } .items-holderf .item .item-icons .i-icon.icon-nooriginal { color: #f59c00; } .items-holderf .item .item-icons .i-icon.icon-sinactividad { color: #007aa2; } .items-holderf .item .item-arrows .mdi { font-size: 22px; } .items-holderf .item .item-arrows .mdi-chevron-up { display: none; } .items-holderf .item:hover { background-color: whitesmoke; } .items-holderf .item.item-new .item-text h3 { color: #50535a; font-family: "TelefonicaBold", sans-serif; } .items-holderf .item.item-new .item-text h3 .user-ani, .items-holder .item.item-new .item-text h3 .user-cliente, .items-holder .item.item-new .item-text h3 .user-cuit { font-family: "TelefonicaBold", sans-serif; } .items-holderf .item.item-new .item-text p span, .items-holder .item.item-new .item-text p strong { color: #50535a; } .items-holderf .item.item-active { background-color: #ffffff; border-left: 5px solid #5bc500; -webkit-box-shadow: -1px 2px 5px 0 rgba(0, 0, 0, 0.1); box-shadow: -1px 2px 5px 0 rgba(0, 0, 0, 0.1); z-index: 1; position: relative; } .items-holderf .item.item-active .item-text h3 { color: #50535a; font-family: "TelefonicaBold", sans-serif; } .items-holderf .item.item-active .item-text p span, .items-holderf .item.item-active .item-text p strong { color: #50535a; } .items-holderf .item.item-desplegable-active { background-color: #ffffff; border-left: 5px solid #5bc500; -webkit-box-shadow: -1px 2px 5px 0 rgba(0, 0, 0, 0.1); box-shadow: -1px 2px 5px 0 rgba(0, 0, 0, 0.1); z-index: 1; position: relative; } .items-holderf .item.item-desplegable-active .item-text h3 { color: #50535a; font-family: "TelefonicaBold", sans-serif; } .items-holderf .item.item-desplegable-active .item-text p span, .items-holderf .item.item-desplegable-active .item-text p strong { color: #50535a; } .items-holderf .item-desplegable-holder { display: none; } .items-holderf .item-desplegable-holder .item { padding-left: 30px; border-left: 5px solid #979797; } .items-holderf .item-desplegable-holder .item.item-active { border-left: 5px solid #5bc500; } .gestion-vacia { width: 100%; height: 100%; display: flex; justify-content: center; } .gestion-vacia .inn { text-align: center; padding: 100px 0 0; } .gestion-vacia .inn h3 { color: #929393; font-family: "TelefonicaLight", sans-serif; font-size: 34px; width: 75%; margin: 0 auto; font-weight: 400; } .gestiones-holder .gestion-item .item-user { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 10px 0; } .gestiones-holder .gestion-item .item-user span { font-family: "TelefonicaBold", sans-serif; font-size: 16px; margin-left: 10px; } .gestiones-holder .gestion-item .item-message { padding: 10px 0; } .gestiones-holder .gestion-item .item-message .btn { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .gestiones-holder .gestion-item .item-message .btn .mdi { font-size: 22px; margin-left: 5px; } .gestiones-holder .gestion-item header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; border-bottom: 1px solid #d3d4d3; padding: 0 25px; flex-direction: column; padding-bottom: 1.4rem; } .gestiones-holder .gestion-item header.default { padding: 0; display: block; border: none; } .gestiones-holder .gestion-item .item-star { padding: 0 5px; } .gestiones-holder .gestion-item .item-star a { display: block; } .gestiones-holder .gestion-item .item-star a::before { content: "\f4d2"; display: inline-block; font-family: "Material Design Icons"; font-size: 22px; text-rendering: auto; line-height: inherit; -webkit-font-smoothing: antialiased; } .gestiones-holder .gestion-item .item-star a:link, .gestiones-holder .gestion-item .item-star a:visited { color: #86888c; } .gestiones-holder .gestion-item .item-star a:hover, .gestiones-holder .gestion-item .item-star a:active { color: #50535a; } .gestiones-holder .gestion-item .item-star a.starred { color: #f59c00; } .gestiones-holder .gestion-item .item-star a.starred::before { content: "\f4ce"; } .gestiones-holder .gestion-item .item-text { padding: 2px 5px 0; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .gestiones-holder .gestion-item .item-text h3 { color: #6c6d71; font-family: "TelefonicaBold", sans-serif; font-size: 24px; margin: 0; padding: 0; padding-bottom: 13px; font-weight: 400; } .gestiones-holder .gestion-item .item-text h3 .user-ani { color: #50535a; } .gestiones-holder .gestion-item .item-text h3 .user-cliente { color: #50535a; } .gestiones-holder .gestion-item .item-text h3 .user-cuit { color: #50535a; } .gestiones-holder .gestion-item .item-text h3 span { font-family: "TelefonicaLight", sans-serif; } .gestiones-holder .gestion-item .item-text p { font-family: "TelefonicaLight", sans-serif; font-size: 16px; color: #50535a; line-height: 1.4; margin: 0; padding: 0; } .gestiones-holder .gestion-item .item-info { color: #86888c; font-family: "TelefonicaLight", sans-serif; font-size: 12px; padding: 0 5px; text-align: right; } .gestiones-holder .gestion-item .item-info .item-icons { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .gestiones-holder .gestion-item .item-info .item-icons .i-icon { display: inline-block; font-size: 22px; padding: 0 2px; } .gestiones-holder .gestion-item .item-info .item-icons .i-icon.icon-excedidas { margin-top: -2px; } .gestiones-holder .gestion-item .item-info .item-icons .i-icon.icon-mora { padding-top: 1px; } .gestiones-holder .gestion-item .item-info .item-icons .i-icon.icon-nooriginal { color: #f59c00; margin-top: 5px; } .gestiones-holder .gestion-item .item-info .item-icons .i-icon.icon-sinactividad { color: #007aa2; } .gestiones-holder .gestion-item .item-info .user-by span { display: block; } .gestiones-holder .gestion-item .item-info .tag { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .gestiones-holder .gestion-item .item-info .tag span { color: #b6b7b7; font-size: 20px; } .gestiones-holder .gestion-item .item-info .tag span:first-child { display: inline-block; background-color: #5bc500; color: #ffffff; font-family: "TelefonicaLight", sans-serif; font-size: 12px; padding: 1px 4px; border-radius: 2px; margin-right: 5px; } .gestiones-holder .gestion-item section { padding-left: 10px; font-family: "TelefonicaLight", sans-serif; font-size: 16px; padding-bottom: 0; } .gestiones-holder .gestion-item section .info { background-color: rgba(0, 169, 224, 0.1); border: 1px solid rgba(0, 169, 224, 0.1); padding: 10px; border-radius: 4px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .gestiones-holder .gestion-item section .info .mdi { font-size: 22px; color: #007aa2; margin-right: 5px; } .gestiones-holder .gestion-item section .info .text { color: #6c6d71; font-family: "TelefonicaLight", sans-serif; font-style: italic; font-size: 14px; margin-top: 8px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable { border-bottom: 1px solid #d3d4d3; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable .filtro { margin-left: 10px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable .filtro .dropdown-toggle { background-color: #f8f8f8; border-radius: 8px; padding: 5px 10px; font-size: 14px; cursor: pointer; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable .filtro .dropdown-menu { border-radius: 8px; -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2); } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable .filtro .dropdown-menu nav span { display: inline-block; font-family: "TelefonicaBold", sans-serif; font-size: 12px; color: #50535a; padding: 5px 15px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable .filtro .dropdown-menu nav a:link, .gestiones-holder .gestion-item section .item-desplegables .i-desplegable .filtro .dropdown-menu nav a:visited { color: #50535a; display: block; font-family: "TelefonicaLight", sans-serif; font-size: 16px; padding: 7px 35px 7px 15px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable .filtro .dropdown-menu nav a:link::before, .gestiones-holder .gestion-item section .item-desplegables .i-desplegable .filtro .dropdown-menu nav a:visited::before { content: ""; display: inline-block; font-family: "Material Design Icons"; font-size: 20px; margin-right: 5px; width: inherit; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable .filtro .dropdown-menu nav a:hover, .gestiones-holder .gestion-item section .item-desplegables .i-desplegable .filtro .dropdown-menu nav a:active { background-color: #f4f4f3; text-decoration: none; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable .filtro .dropdown-menu nav a.active::before { content: "\f12c"; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 20px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable header .titulo { color: #50535a; font-family: "TelefonicaLight", sans-serif; font-size: 24px; line-height: 1; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable header .icons { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; margin-right: 10px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable header .icons .i-icon { display: inline-block; font-size: 22px; padding: 0 2px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable header .icons .i-icon.icon-excedidas { margin-top: -2px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable header .icons .i-icon.icon-mora { padding-top: 1px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable header .icons .i-icon.icon-nooriginal { color: #f59c00; margin-top: 5px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable header .icons .i-icon.icon-sinactividad { color: #007aa2; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable header .arrow { font-size: 24px; width: 24px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable header .arrow .mdi-chevron-down { display: none; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section { padding: 0; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .progress-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 10px 0; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .progress-item .pi-title { text-align: center; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .progress-item .pi-title span { color: #86888c; display: block; font-family: "TelefonicaLight", sans-serif; font-size: 14px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .progress-item .pi-title span:first-child { font-family: "TelefonicaBold", sans-serif; font-size: 24px; line-height: 1; color: #50535a; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .progress-item .pi-progress { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .progress-item .pi-progress .slots { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .progress-item .pi-progress .slots span { color: #86888c; font-family: "TelefonicaLight", sans-serif; font-size: 14px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-servicios ul { margin: 0; padding: 0; list-style: none; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-servicios ul li { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid #e9eae8; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-servicios ul li:last-child { border-bottom: none; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-servicios ul li span:nth-child(2) { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; font-size: 16px; font-family: "TelefonicaLight", sans-serif; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-servicios ul li span.icon { margin-right: 10px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-servicios ul li span.icon .mdi-close-circle { display: block; color: #ec6839; font-size: 22px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-servicios ul li span.icon .mdi-check-circle { display: none; color: #5bc500; font-size: 22px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-servicios ul li span a:link, .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-servicios ul li span a:visited { color: #007aa2; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-servicios ul li span a:hover, .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-servicios ul li span a:active { color: #14c5ff; text-decoration: none; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-servicios ul li.active span:nth-child(2) { color: #50535a; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-servicios ul li.active span.icon .mdi-close-circle { display: none; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-servicios ul li.active span.icon .mdi-check-circle { display: block; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-servicios ul li.active a:link, .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-servicios ul li.active a:visited { color: #b6b7b7; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-servicios ul li.active a:hover, .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-servicios ul li.active a:active { color: #b6b7b7; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-equipos ul { margin: 0; padding: 0; list-style: none; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-equipos ul li { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin: 0 0 10px; padding: 20px 0; border-bottom: 1px solid #e9eae8; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-equipos ul li:last-child { border-bottom: none; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-equipos ul li span:nth-child(2) { color: #b6b7b7; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; font-size: 16px; font-family: "TelefonicaLight", sans-serif; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-equipos ul li span.date { -ms-flex-item-align: start; align-self: flex-start; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-equipos ul li span.date p { color: #86888c; font-family: "TelefonicaLight", sans-serif; font-size: 14px; margin: 0; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-equipos ul li span.icon { margin-right: 10px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-equipos ul li span.icon .mdi-cellphone-android { display: block; color: #f59c00; font-size: 35px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-equipos ul li span h4 { color: #86888c; font-family: "TelefonicaBold", sans-serif; font-size: 12px; text-transform: uppercase; margin: 0 0 5px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-equipos ul li span h3 { color: #50535a; font-family: "TelefonicaBold", sans-serif; font-size: 18px; margin: 0 0 5px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-equipos ul li span p { color: #50535a; font-family: "TelefonicaLight", sans-serif; font-size: 18px; margin: 0; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-equipos ul li span span { color: #86888c; font-family: "TelefonicaLight", sans-serif; font-size: 14px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-equipos ul li span span strong { font-family: "TelefonicaBold", sans-serif; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .lista-equipos ul li.linea-ok span.icon .mdi-cellphone-android { color: #5bc500; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .cliente { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-line-pack: center; align-content: center; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .cliente span { font-family: "TelefonicaLight", sans-serif; font-size: 18px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .cliente span strong { font-family: "TelefonicaBold", sans-serif; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .cliente span strong span { color: #007aa2; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .cliente span:last-child { color: #007aa2; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .cuit-dire { margin: 20px 0; padding: 20px 0; border-top: 1px solid #e9eae8; border-bottom: 1px solid #e9eae8; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .cuit-dire .block h2 { color: #50535a; font-family: "TelefonicaBold", sans-serif; font-size: 12px; text-transform: uppercase; margin: 0 0 5px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .cuit-dire .block h3 { color: #50535a; font-family: "TelefonicaBold", sans-serif; font-size: 18px; margin: 0 0 5px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .cuit-dire .block p { color: #50535a; font-family: "TelefonicaLight", sans-serif; font-size: 18px; margin: 0; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .resumen { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-line-pack: center; align-content: center; padding: 20px 0; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .resumen span { font-family: "TelefonicaBold", sans-serif; font-size: 18px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .total-pagar { border-bottom: 1px solid #e9eae8; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-line-pack: center; align-content: center; background-color: #f8f8f8; padding: 20px; margin: 0; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .total-pagar span { font-family: "TelefonicaBold", sans-serif; font-size: 18px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .links { padding: 10px 0 20px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .links a:link, .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .links a:visited { color: #007aa2; font-family: "TelefonicaBold", sans-serif; font-size: 14px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .links a:link .mdi, .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .links a:visited .mdi { font-size: 22px; margin-right: 5px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .links.show-hide a .mdi-minus-circle { display: none; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .talon-pago-holder { padding: 10px 0 0 0; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .comprobantes { padding: 10px 0 0; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .facturacion-detalle .comprobantes .titulo { font-family: "TelefonicaBold", sans-serif; font-size: 18px; padding: 10px 0; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .detalles-plan .detalle { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; border-bottom: 1px solid #e9eae8; padding-bottom: 20px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .detalles-plan .detalle div span { font-family: "TelefonicaLight", sans-serif; font-size: 12px; color: #404041; text-transform: uppercase; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .detalles-plan .detalle div h3 { color: #50535a; font-family: "TelefonicaBold", sans-serif; font-size: 18px; margin: 0 0 5px; } .gestiones-holder .gestion-item section .item-desplegables .i-desplegable section .detalles-plan .detalle div:last-child { text-align: right; } .gestiones-holder .gestion-item section .item-desplegables.active { border-left: 5px solid #5bc500; } .gestiones-holder .gestion-item section .item-desplegables.item-no-desplegable { border-left: 5px solid rgba(0, 0, 0, 0); } .gestiones-holder .gestion-item .table { margin-bottom: 0; border-bottom: 1px solid #e9eae8; } .gestiones-holder .gestion-item .table th, .gestiones-holder .gestion-item .table td { border-color: #d3d4d3; } .gestiones-holder .gestion-item .table thead th, .gestiones-holder .gestion-item .table thead td { vertical-align: bottom; border-top: none; border-bottom: 1px solid #e9eae8; font-family: "TelefonicaLight", sans-serif; font-size: 12px; color: #6c6d71; text-transform: uppercase; font-weight: 700; } .gestiones-holder .gestion-item .table tbody td, .gestiones-holder .gestion-item .table tbody th { font-family: "TelefonicaLight", sans-serif; font-size: 16px; color: #50535a; padding: 15px 10px; } .gestiones-holder .gestion-item .table tbody td .mdi, .gestiones-holder .gestion-item .table tbody th .mdi { font-size: 22px; } .gestiones-holder .gestion-item .table.table-comprobantes thead th:nth-child(3) { text-align: center; } .gestiones-holder .gestion-item .table.table-comprobantes thead th:nth-child(4) { display: flex; align-items: center; justify-content: center; } .gestiones-holder .gestion-item .table.table-comprobantes thead th:nth-child(5) { text-align: center; } .gestiones-holder .gestion-item .table.table-comprobantes tbody td:nth-child(3) { text-align: center; } .gestiones-holder .gestion-item .table.table-comprobantes tbody td:nth-child(4) { text-align: center; } .gestiones-holder .gestion-item .table.table-comprobantes tbody td:nth-child(5) { text-align: center; } .gestiones-holder .gestion-item .table.table-detalles { border-bottom: 1px solid #d3d4d3; } .gestiones-holder .gestion-item .table-striped tbody tr:nth-of-type(even) { background-color: #f8f8f8; } .gestiones-holder .gestion-item .table-striped tbody tr:nth-of-type(odd) { background-color: inherit; } .gestiones-holder .gestion-item footer { padding: 0 25px; } .gestiones-holder .gestion-item footer .reply-box { padding: 10px 0; } .gestiones-holder .gestion-item footer .reply-box textarea { color: #50535a; border: 1px solid #007aa2; background-color: #ffffff; font-family: "TelefonicaLight", sans-serif; font-size: 16px; padding: 10px; border-radius: 5px; min-height: 80px; width: 100%; } .gestiones-holder .gestion-item footer .reply-box textarea::-webkit-input-placeholder { color: #86888c; } .gestiones-holder .gestion-item footer .reply-box textarea:-ms-input-placeholder { color: #86888c; } .gestiones-holder .gestion-item footer .reply-box textarea::-ms-input-placeholder { color: #86888c; } .gestiones-holder .gestion-item footer .reply-box textarea::placeholder { color: #86888c; } .gestiones-holder .gestion-item footer .reply-box textarea:focus, .gestiones-holder .gestion-item footer .reply-box textarea:active { outline: none; -webkit-box-shadow: inherit; box-shadow: inherit; } .gestiones-holder .gestion-item .chat-holder { padding: 0 25px; } .gestiones-holder .gestion-item .chat-holder .chat { font-family: "TelefonicaLight", sans-serif; font-size: 16px; } .gestiones-holder .gestion-item .chat-holder .chat header { -webkit-box-align: center; -ms-flex-align: center; align-items: center; border: none; padding: 0; } .gestiones-holder .gestion-item .chat-holder .chat header .time { color: #86888c; font-family: "TelefonicaLight", sans-serif; font-size: 12px; } .gestiones-holder .gestion-item .chat-holder .chat p { line-height: 1.6; } .dashboard .empresas-sep { background-color: #f8f8f8; } .dashboard .dashboard-title { margin: 30px 0 40px 10px; } .dashboard .dashboard-title span { font-size: 16px; color: #86888c; } .dashboard .card { border-radius: 8px; padding: 20px 20px 30px; margin: 0 10px; } .dashboard .card h3 { color: #50535a; font-family: "TelefonicaBold", sans-serif; font-size: 16px; margin-bottom: 10px; } .dashboard .card .btns-holder { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; justify-items: center; -ms-flex-pack: distribute; justify-content: space-around; } .dashboard .card .btns-holder a:link, .dashboard .card .btns-holder a:visited { background-color: #f8f8f8; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; padding: 10px; border-radius: 100%; width: 80px; height: 80px; position: relative; } .dashboard .card .btns-holder a:link span.mdi, .dashboard .card .btns-holder a:visited span.mdi { font-size: 60px; } .dashboard .card .btns-holder a:link span.icon-svg img, .dashboard .card .btns-holder a:visited span.icon-svg img { width: 56px; } .dashboard .card .btns-holder a:link span.badge, .dashboard .card .btns-holder a:visited span.badge { position: absolute; bottom: 0; right: 0; } .dashboard .card .btns-holder a:link:hover, .dashboard .card .btns-holder a:link:active, .dashboard .card .btns-holder a:visited:hover, .dashboard .card .btns-holder a:visited:active { background-color: #e9eae8; } .dashboard .card .btns-holder a.color-gris { color: #d3d4d3; } .dashboard .card .btns-holder a.color-green { color: #5bc500; } .dashboard .card .btns-holder a.color-yellow { color: #f59c00; } .dashboard .card .btns-holder a.color-orange { color: #ec6839; } .filtros-full { padding: 0 20px; } .filtros-full h3 { color: #50535a; font-size: 18px; font-family: "TelefonicaBold", sans-serif; margin: 20px 0; } .filtros-full .filtros-full-inn { padding-left: 26px; } .filtros-full .filtros-full-inn .custom-filter .custom-control-label::before { top: 3px; } .filtros-full .filtros-full-inn .custom-filter .custom-control-label::after { top: 3px; } .redactar-gestion-holder { display: none; position: fixed; z-index: 9999; bottom: 0; right: 8px; } .redactar-gestion-holder .redactar-box { min-width: 570px; padding: 20px; -webkit-box-shadow: 0 -5px 12px rgba(0, 0, 0, 0.35); box-shadow: 0 -5px 12px rgba(0, 0, 0, 0.35); background-color: #ffffff; } .redactar-gestion-holder .redactar-box .gestion-header { background-color: white; border-radius: 20px 20px 0 0; color: dimgrey; padding: 10px 30px 5px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .redactar-gestion-holder .redactar-box .gestion-header .notif-title-box { color: black; font-size: 22px; } .redactar-gestion-holder .redactar-box .gestion-header .notif-title-box div p { color: blue; font-size: 14px; text-decoration: underline; } .redactar-gestion-holder .redactar-box .gestion-header a { color: #ffffff; font-size: 22px; } .redactar-gestion-holder .redactar-box .gestion-header #close-notif a span { color: #007ACD; font-size: 22px; } .redactar-gestion-holder .redactar-box .mercado-pago-header { background-color: #007aa2; border-radius: 20px 20px 0 0; color: #ffffff; padding: 10px 30px 5px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .redactar-gestion-holder .redactar-box .mercado-pago-header h3 { font-family: "TelefonicaLight", sans-serif; font-size: 18px; line-height: 1.6; padding: 0; margin: 0; } .redactar-gestion-holder .redactar-box .mercado-pago-header h3 span { color: rgba(255, 255, 255, 0.5); } .redactar-gestion-holder .redactar-box .mercado-pago-header a { color: #ffffff; font-size: 24px; } .redactar-gestion-holder .redactar-box .mercado-pago-header .mdi-arrow-expand { display: none; } .redactar-gestion-holder .redactar-box header { background-color: white; color: white; padding: 10px 30px 5px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .redactar-gestion-holder .redactar-box header h3 { font-family: "TelefonicaLight", sans-serif; font-size: 18px; line-height: 1.6; padding: 0; margin: 0; } .redactar-gestion-holder .redactar-box header h3 span { color: rgba(255, 255, 255, 0.5); } .redactar-gestion-holder .redactar-box header a { color: #ffffff; font-size: 24px; } .redactar-gestion-holder .redactar-box header .mdi-arrow-expand { display: none; } .redactar-gestion-holder .redactar-box .header-popup { background-color: #007aa2; border-radius: 20px 20px 0 0; color: #ffffff; padding: 10px 30px 5px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .redactar-gestion-holder .redactar-box .header-popup h3 { font-family: "TelefonicaLight", sans-serif; font-size: 18px; line-height: 1.6; padding: 0; margin: 0; } .redactar-gestion-holder .redactar-box .header-popup h3 span { color: rgba(255, 255, 255, 0.5); } .redactar-gestion-holder .redactar-box .header-popup a { color: #ffffff; font-size: 24px; } .redactar-gestion-holder .redactar-box .header-popup .mdi-arrow-expand { display: none; } .redactar-gestion-holder .redactar-box section { background-color: #ffffff; padding: 0 10px; } #container-notificaciones-config .row-config label { margin-right: 10px; font-size: 16px; font-family: Roboto; font-weight: 400; line-height: 24px; word-wrap: break-word } .redactar-gestion-holder .redactar-box section .tipos-holder button:first-child { margin-right: 5px; } .redactar-gestion-holder .redactar-box section .tipos-holder #btn-pedido:hover { background-color: #3c8700; } .redactar-gestion-holder .redactar-box section .tipos-holder button:last-child { margin-left: 5px; } .redactar-gestion-holder .redactar-box section .adjuntar { margin: 15px 0; } .redactar-gestion-holder .redactar-box section h4 { color: #50535a; font-family: "TelefonicaBold", sans-serif; font-size: 14px; padding: 6px 0 5px; } .redactar-gestion-holder .redactar-box footer { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-line-pack: center; align-content: center; padding: 0 30px; } .redactar-gestion-holder .redactar-box .creado-por { padding: 0px 30px 20px; font-family: "TelefonicaLight", sans-serif; font-size: 14px; color: #86888c; } .redactar-gestion-holder .redactar-box .creado-por span { display: block; font-style: italic; } .alert-bottom-left { position: fixed; left: 20px; bottom: 20px; -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15); box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15); } .alert-bottom-left.alert-bottom-left-green { background-color: #5bc500; background-position: 10px center; background-repeat: no-repeat; color: #ffffff; padding-left: 45px; } .alert-bottom-left.error { background-color: #f2dede !important; border-color: #ebcccc; color: #a94442; } .alert-bottom-left .close { color: #ffffff; opacity: 0.9; } .alert-bottom-left .close.error { color: #a94442 !important; opacity: 0.9; } .alert-bottom-left .close:hover { color: #ffffff !important; opacity: 1; } .user-ani .sep::before, .user-cliente .sep::before, .user-cuit .sep::before { content: "-"; display: inline; } .footer { border-top: 4px solid #f4f4f3; } .footer-container { min-height: 50px; } .logo-footer img { max-width: 200px; } @media (min-width: 576px) and (max-width: 992px) { .logo-footer img { max-width: 200px; } } .nav-footer { display: -webkit-box; display: -ms-flexbox; display: flex; list-style: none; margin: 0; padding: 0; } .nav-footer li { color: #007aa2; font-family: "TelefonicaLight", sans-serif; margin: 0 0 0 20px; padding: 0; } .nav-footer li a { color: #50535a; display: inline-block; } .color-white { color: #ffffff; } .title-solo { margin: 0 0 20px; } .fullbg { min-height: calc(100vh - (88px + 54px)); } .fullbg-img { background: -webkit-gradient( linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0.5)) ), url(/Content/assets/img/fondo-2.jpg); background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(/Content/assets/img/fondo-2.jpg); background-repeat: no-repeat; background-position: center; background-size: cover; } .pt-30 { padding-top: 30px; } .block-transparente-100 { background-color: white; border-top: 8px solid rgba(0, 169, 224, 0.5); -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2); color: #ffffff; padding: 20px; } .block-transparente-100 h1 { color: #50535a; } .block-transparente-100 h2 { color: #50535a; } .block-transparente-100 h3 { color: #50535a; } .block-transparente-100 h4 { color: #50535a; } .block-transparente-100 h5 { color: #50535a; } .block-transparente-100 h6 { color: #50535a; } .block-transparente-100 form { margin-top: 20px; } .block-transparente-100 .btn { margin-left: 10px; } .card { border: none; border-radius: 0; -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2); -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .card.card-flex-center { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .card.card-mb { margin-bottom: 20px; } .card.card-pad-15 { padding: 15px; } .card > a { color: #50535a; display: block; padding: 10px; } .card > a:hover, .card > a:active { text-decoration: none; } .card > a i { -ms-flex-item-align: end; align-self: flex-end; font-size: 34px; } .card > a i.fr { float: right; } .card.primary { border-top: 8px solid #007aa2; } .card.primary > a { color: #007aa2; } .card.primary > a p { color: #50535a; } .card.primary > a:hover, .card.primary > a:active { color: #009acc; text-decoration: none; } .card.primary:hover, .card.primary:active { border-top: 8px solid #009acc; } .card.secondary { border-top: 8px solid #50535a; } .card.secondary > a { color: #50535a; } .card.secondary > a p { color: #50535a; } .card.secondary > a:hover, .card.secondary > a:active { color: #46494f; text-decoration: none; } .card.secondary:hover, .card.secondary:active { border-top: 8px solid #46494f; } .card.success { border-top: 8px solid #5bc500; } .card.success > a { color: #5bc500; } .card.success > a p { color: #50535a; } .card.success > a:hover, .card.success > a:active { color: #52b100; text-decoration: none; } .card.success:hover, .card.success:active { border-top: 8px solid #52b100; } .card.info { border-top: 8px solid #17a2b8; } .card.info > a { color: #17a2b8; } .card.info > a p { color: #50535a; } .card.info > a:hover, .card.info > a:active { color: #1592a6; text-decoration: none; } .card.info:hover, .card.info:active { border-top: 8px solid #1592a6; } .card.warning { border-top: 8px solid #f59c00; } .card.warning > a { color: #f59c00; } .card.warning > a p { color: #50535a; } .card.warning > a:hover, .card.warning > a:active { color: #e18f00; text-decoration: none; } .card.warning:hover, .card.warning:active { border-top: 8px solid #e18f00; } .card.danger { border-top: 8px solid #e9426d; } .card.danger > a { color: #e9426d; } .card.danger > a p { color: #50535a; } .card.danger > a:hover, .card.danger > a:active { color: #e7305f; text-decoration: none; } .card.danger:hover, .card.danger:active { border-top: 8px solid #e7305f; } .card.light { border-top: 8px solid #f4f4f3; } .card.light > a { color: #f4f4f3; } .card.light > a p { color: #50535a; } .card.light > a:hover, .card.light > a:active { color: #eaeae8; text-decoration: none; } .card.light:hover, .card.light:active { border-top: 8px solid #eaeae8; } .card.dark { border-top: 8px solid #343a40; } .card.dark > a { color: #343a40; } .card.dark > a p { color: #50535a; } .card.dark > a:hover, .card.dark > a:active { color: #2b3035; text-decoration: none; } .card.dark:hover, .card.dark:active { border-top: 8px solid #2b3035; } .card.purple { border-top: 8px solid #954b97; } .card.purple > a { color: #954b97; } .card.purple > a p { color: #50535a; } .card.purple > a:hover, .card.purple > a:active { color: #884489; text-decoration: none; } .card.purple:hover, .card.purple:active { border-top: 8px solid #884489; } .card.orange { border-top: 8px solid #ec6839; } .card.orange > a { color: #ec6839; } .card.orange > a p { color: #50535a; } .card.orange > a:hover, .card.orange > a:active { color: #ea5a26; text-decoration: none; } .card.orange:hover, .card.orange:active { border-top: 8px solid #ea5a26; } .card h4 { margin: 0; } .card p { margin: 0; } .footer-gral { background: #e9eae8; position: absolute; top: auto; width: 100%; display: inline-block; margin-top: 20px; top: auto; } .footer-gral h3 { font-family: "TelefonicaBold", sans-serif; font-size: 18px; color: #50535a; margin: 30px 20px; margin-bottom: 0; } ol, ul, dl { margin-top: 0px; /*margin-bottom: 1rem;*/ } .footer-grale ul { list-style: none; margin: 2px 20px; padding: 0; } .footer-grale ul li { padding: 0; } a { color: #007aa2; text-decoration: none; background-color: transparent; } a:hover { color: #007aa2; text-decoration: underline; } .footer-grale ul li a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; padding: 10px 0; border-bottom: 1px solid #d3d4d3; min-height: 69px; } .footer-grale ul li a:link, .footer-gral ul li a:visited { text-decoration: none; } .footer-gral ul li a .nav-representante { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding: 0; font-family: "TelefonicaLight", sans-serif; font-size: 18px; } .footer-grale ul li a .mdi { font-size: 24px; color: #b6b7b7; } .fade { -webkit-transition: opacity 0.15s linear; transition: opacity 0.15s linear; } .modal { position: fixed; top: 0px; right: 0px; bottom: 0px; left: 0px; z-index: 1050; display: none; overflow: hidden; outline: 0; } :not(.show).fade { opacity: 0; } .modal-dialog { position: relative; width: auto; margin: 0.5rem; pointer-events: none; } .modal-dialog { max-width: 500px; margin: 1.75rem auto; } .modal.fade .modal-dialog { -webkit-transition: -webkit-transform 0.3s ease-out; transition: -webkit-transform 0.3s ease-out; transition: transform 0.3s ease-out; transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out; -webkit-transform: translate(0px, -25%); transform: translate(0px, -25%); } .modal-content { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; pointer-events: auto; background-color: #ffffff; background-clip: padding-box; border: 1px solid rgba(0, 0, 0, 0.2); border-radius: 0.3rem; outline: 0; top: 20%; } .modal-dialog .modal-content { border: none; } .modal-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 1rem; border-bottom: 1px solid #e9eae8; border-top-left-radius: 0.3rem; border-top-right-radius: 0.3rem; } .modal-header .close-min .close-x { color: #ffffff; font-size: 24px; opacity: 1; padding-top: 20px; } .modal-dialog .modal-content .modal-header-representante { background-color: #007aa2; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .modal-body { position: relative; -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; padding: 1rem; } .modal-dialog .modal-content .modal-body-representante { padding: 0; } .modal-dialog .modal-content .modal-body-representante .representante-list { list-style: none; margin: 0; padding: 0; } .modal-dialog .modal-content .modal-body-representante .representante-list li { margin: 0; padding: 0; } .modal-dialog .modal-content .modal-body-representante .representante-list li a:link, .modal-dialog .modal-content .modal-body-representante .representante-list li a:visited { color: #50535a; font-family: "TelefonicaLight", sans-serif; font-size: 16px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .modal-dialog .modal-content .modal-body-representante .representante-list li a:link > span:first-child, .modal-dialog .modal-content .modal-body-representante .representante-list li a:visited > span:first-child { padding: 0 15px 0 10px; color: #86888c; } img { vertical-align: middle; border-style: none; } .modal-dialog .modal-content .modal-header-representante .nav-representante { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding: 0 10px; } button { border-radius: 0; } input, button, select, optgroup, textarea { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit; } button, input { overflow: visible; } button, select { text-transform: none; } .close { float: right; font-size: 1.5rem; font-weight: 700; line-height: 1; color: #000; text-shadow: 0px 1px 0px #ffffff; opacity: 0.5; } button, html [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } button.close { padding: 0; background-color: transparent; border: 0; -webkit-appearance: none; } .modal-header .close { padding: 1rem; margin: -1rem -1rem -1rem auto; } :not(:disabled):not(.disabled).close { cursor: pointer; } .modal-dialog .modal-content .modal-header-representante .close { color: #ffffff; text-shadow: inherit; opacity: 1; } .modal-dialog .modal-content .modal-header-representante .nav-representante span { font-family: "TelefonicaLight", sans-serif; font-size: 14px; color: #ffffff; line-height: 1; } .modal-dialog .modal-content .modal-header-representante .nav-representante h4 { font-family: "TelefonicaLight", sans-serif; font-size: 18px; color: #ffffff; margin: 0; padding: 0; } .lista_11nov { margin-top: 30px; min-height: 195px; } .lista_11nov h3 { color: #50535a; font-family: "TelefonicaBold", sans-serif; font-size: 16px; margin-bottom: 10px; } .lista_11nov ul { margin: 0; padding: 0; list-style: none; } .lista_11nov ul li { padding: 0; margin: 0; border-bottom: 1px solid #d3d4d3; } .lista_11nov ul li:last-child { border-bottom: none; } .lista_11nov ul li a, .lista_11nov ul li a:link, .lista_11nov ul li a:visited { -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #50535a; display: -webkit-box; display: -webkit-box; display: -webkit-box; line-height: 1; padding: 14px 0; } .lista_11nov ul li a img, .lista_11nov ul li a:link img, .lista_11nov ul li a:visited img { margin-right: 10px; } .lista_11nov ul li a .mdi, .lista_11nov ul li a:link .mdi, .lista_11nov ul li a:visited .mdi { color: #007aa2; font-size: 20px; line-height: 1; margin-left: auto; margin-top: 2px; } *, *::before, *::after { -webkit-box-sizing: border-box; box-sizing: border-box; } .modal-dialog { position: relative; width: auto; margin: 0.5rem; pointer-events: none; } /* @media all and (min-width:576px) */ .modal-dialog { max-width: 500px; margin: 1.75rem auto; } .modal.fade .modal-dialog { -webkit-transition: -webkit-transform 0.3s ease-out; transition: -webkit-transform 0.3s ease-out; transition: transform 0.3s ease-out; transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out; -webkit-transform: translate(0px, -25%); transform: translate(0px, -25%); } .modal.show .modal-dialog { -webkit-transform: translate(0px, 0px); transform: translate(0px, 0px); } .fade { -webkit-transition: opacity 0.15s linear; transition: opacity 0.15s linear; } .modal { position: fixed; top: 0px; right: 0px; bottom: 0px; left: 0px; z-index: 1050; display: none; overflow: hidden; outline: 0; } .modal-open .modal { overflow-x: hidden; overflow-y: auto; } .modal-open { overflow: hidden; } .modal-content { position: relative; display: -webkit-box; display: -webkit-box; display: -ms-flexbox; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; pointer-events: auto; background-color: #ffffff; background-clip: padding-box; border: 1px solid rgba(0, 0, 0, 0.2); border-radius: 0.3rem; outline: 0; } .modal-dialog .modal-content { border: none; } .modal-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 1rem; border-bottom: 1px solid #e9eae8; border-top-left-radius: 0.3rem; border-top-right-radius: 0.3rem; } .modal-dialog .modal-content .modal-header-representante { background-color: #007aa2; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .modal-body { position: relative; -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; padding: 1rem; } .modal-dialog .modal-content .modal-body-representante { padding: 0; } ol, ul, dl { margin-top: 0px; margin-bottom: 1rem; } .footer-gral ul { list-style: none; margin: 0 20px; padding: 0; } .modal-dialog .modal-content .modal-body-representante .representante-list { list-style: none; margin: 0; padding: 0; } .footer-gral ul li { padding: 0; } .modal-dialog .modal-content .modal-body-representante .representante-list li { margin: 0; padding: 0; } a { color: #007aa2; text-decoration: none; background-color: transparent; -webkit-text-decoration-skip: objects; } .footer-gral ul li a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; padding: 10px 0; border-bottom: 1px solid #d3d4d3; min-height: 69px; } .footer-gral ul li a:link, .footer-gral ul li a:visited { text-decoration: none; } .modal-dialog .modal-content .modal-body-representante .representante-list li a:link, .modal-dialog .modal-content .modal-body-representante .representante-list li a:visited { color: #50535a; font-family: "TelefonicaLight", sans-serif; font-size: 16px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .mdi::before, .mdi-set { display: inline-block; font: normal normal normal 24px/1 "Material Design Icons"; font-size: inherit; text-rendering: auto; line-height: inherit; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .footer-gral ul li a .mdi { font-size: 24px; color: #b6b7b7; } .modal-dialog .modal-content .modal-body-representante .representante-list li a:link > span:first-child, .modal-dialog .modal-content .modal-body-representante .representante-list li a:visited > span:first-child { padding: 0 15px 0 10px; color: #86888c; } img { vertical-align: middle; border-style: none; } .modal-dialog .modal-content .modal-header-representante .nav-representante { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding: 0 10px; } button { border-radius: 0; } input, button, select, optgroup, textarea { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit; } button, input { overflow: visible; } button, select { text-transform: none; } button:focus { outline: 1px dotted; outline: 5px auto -webkit-focus-ring-color; } button, html [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } .close { float: right; font-size: 1.5rem; font-weight: 700; line-height: 1; color: #000; text-shadow: 0px 1px 0px #ffffff; opacity: 0.5; } button.close { padding: 0; background-color: transparent; border: 0; -webkit-appearance: none; } .modal-header .close { padding: 1rem; margin: -1rem -1rem -1rem auto; } :not(:disabled):not(.disabled).close { cursor: pointer; } :not(:disabled):not(.disabled).close:hover, :not(:disabled):not(.disabled).close:focus { color: #000; text-decoration: none; opacity: 0.75; } .modal-dialog .modal-content .modal-header-representante .close { color: #ffffff; text-shadow: inherit; opacity: 1; } .modal-dialog .modal-content .modal-header-representante .nav-representante span { font-family: "TelefonicaLight", sans-serif; font-size: 14px; color: #ffffff; line-height: 1; } h1, h2, h3, h4, h5, h6 { margin-top: 0px; margin-bottom: 0.5rem; } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { margin-bottom: 0.5rem; font-family: inherit; font-weight: 500; line-height: 1.2; color: inherit; } h4, .h4 { font-size: 1.5rem; } h1, h2, h3, h4 { font-family: "TelefonicaLight", sans-serif; font-weight: 600; } .modal-dialog .modal-content .modal-header-representante .nav-representante h4 { font-family: "TelefonicaLight", sans-serif; font-size: 18px; color: #ffffff; margin: 0; padding: 0; } .fade { -webkit-transition: opacity 0.15s linear; transition: opacity 0.15s linear; } .modal-backdrop { position: fixed; top: 0px; right: 0px; bottom: 0px; left: 0px; z-index: 1040; background-color: #000; } .modal-backdrop.fade { opacity: 0; } .modal-backdrop.show { opacity: 0.5; } .close { float: right; font-size: 1.5rem; font-weight: 700; line-height: 0.6; color: #000; text-shadow: 0 1px 0 #fff; opacity: 0.5; } .close:not(:disabled):not(.disabled) { cursor: pointer; } .close:not(:disabled):not(.disabled):hover, .close:not(:disabled):not(.disabled):focus { color: #000; text-decoration: none; opacity: 0.75; } .modal-dialog-centered::before { display: block; height: calc(100vh - (0.5rem * 2)); content: ""; } button.close { padding: 0; background-color: transparent; border: 0; -webkit-appearance: none; } .left-menu .lista_11nov h3 { font-size: 14px; } ol, ul, dl { margin-top: 0px; margin-bottom: 1rem; } .lista_11nov ul { margin: 0; padding: 0; list-style: none; } .lista_11nov ul li { padding: 0; margin: 0; border-bottom: 1px solid #d3d4d3; } .lista_11nov ul li:last-child { border-bottom: none; } a { color: #006d91; text-decoration: none; background-color: transparent; -webkit-text-decoration-skip: objects; } .lista_11nov ul li a, .lista_11nov ul li a:link, .lista_11nov ul li a:visited { -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #50535a; display: -webkit-box; display: -ms-flexbox; display: flex; line-height: 1; padding: 14px 0; } img { vertical-align: middle; border-style: none; } .lista_11nov ul li a img, .lista_11nov ul li a:link img, .lista_11nov ul li a:visited img { margin-right: 10px; } .mdi::before, .mdi-set { display: inline-block; font: normal normal normal 24px/1 "Material Design Icons"; font-size: inherit; text-rendering: auto; line-height: inherit; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .mdi-chevron-right::before { content: "\F142"; } .lista_11nov ul li a .mdi, .lista_11nov ul li a:link .mdi, .lista_11nov ul li a:visited .mdi { color: #007aa2; font-size: 20px; line-height: 1; margin-left: auto; margin-top: 2px; } .left-menu .lista_11nov ul li a .mdi { display: none; } .filtrosBuscador input[type="radio"] { font-family: "TelefonicaLight", sans-serif; text-decoration: none; min-height: initial; width: auto; margin-left: 15px; } .filtrosBuscador label:hover { color: #007aa2; cursor: pointer; } .filtrosBuscador.active { color: #007aa2; font-weight: bold; } .item-text > .divAlias { display: block !important; } .filtrosBuscador { display: inline-block; position: relative; } .filtrosBuscador input[type="radio"] { display: none; } .filtrosBuscador label:before { content: " "; display: inline-block; position: relative; top: 1px; margin: 0 5px 0 0; width: 10px; height: 10px; border-radius: 11px; border: 2px solid #00dae029; background-color: transparent; } .filtrosBuscador input[type="radio"]:checked + label:after { border-radius: 11px; width: 10px; height: 10px; position: absolute; top: 10px; left: 0px; content: " "; display: block; background: #007aa2; } .envioEquipo { color: #50535a !important; cursor: pointer; height: 65px; } .envioEquipo:hover { text-decoration: underline !important; background-color: white !important; } #mainNcNd table td, #mainFacturasEquipo table td { vertical-align: middle; font-size: 14px; line-height: 16px; font-family: 'TelefonicaRegular'; color: #3D3D3D; } #mainNcNd table th, #mainFacturasEquipo table th { color: white; background-color: #007aa2; font-size: 14px; line-height: 16px; font-weight: inherit; } #mainCalipso table td { vertical-align: middle; } #mainCalipso table td[scope=col] { color: white; background-color: #007aa2; } #btnsNcNd, #btnsFacturasEquipo { display: flex; justify-content: space-between; margin-bottom: 10px; /*width: calc(100% - 341px);*/ align-items: center; width: 98%; } #btnsCalipso { display: flex; justify-content: space-between; margin-bottom: 20px; width: 100%; align-items: center; } #mainNcNd input[type="checkbox"], #mainFacturasEquipo input[type="checkbox"] { width: 20px; height: 20px; } #mainCalipso input[type="checkbox"] { width: 20px; height: 20px; } .btn-off, .btn-off:hover { cursor: not-allowed !important; color: white !important; box-shadow: none !important; background-color: #737373 !important; border-color: #cfd3dd7d !important; } #mainNcNd th, #mainFacturasEquipo th { font-size: medium; } #mainCalipso th { font-size: medium; } .icon-disabled { color: #8080809c !important; cursor: initial !important; } #tablaNcNd th, #tablaFacturasEquipo th { position: sticky; top: -1px; } #tablaCalipso th { position: sticky; top: -1px; background: #007aa2; color: #ffffff; } table#tablaSolicitudDescarga th { /*padding: 12px;*/ } .detalle-consumo { border: 1px solid #0000001a; margin-left: 10px; background-color: #f8f8f8; } .detalle-consumo-top { border-bottom: none; border-radius: 10px 10px 0px 0px; padding-right: 20px !important; margin-top: 1rem; } .detalle-consumo-bottom { border-top: none; border-radius: 0px 0px 10px 10px; margin-right: -10px; margin-bottom: 1rem; } #tabla_0800 { margin-bottom: 0px; } #tabla_0800 th { border: none; } .tabla_0800 { width: 55%; margin: auto; text-align: center; max-height: 38vh; overflow-y: auto; overflow-x: hidden; border: 1px solid #80808033; padding: 9px 9px 0px; box-shadow: 2px 3px 10px 1px #80808070; } .span-serviciosHabilitados { margin-right: 10px; } #box-mercadopago, #box-gestion { width: fit-content; height: fit-content; } .month-disabled { background: #70809033 !important; cursor: not-allowed; color: initial !important; } .month-enabled { cursor: pointer; } .btn-disabled { pointer-events: none; cursor: default !important; } .cl_container { border-radius: 20px; margin-top: 20px; border-bottom: 1px solid #0000006b; border-left: 1px solid #0000006b; border-right: 1px solid #0000006b; } #frame-calendario, #frame-calendario-calipso, #frame-calendario-FacturasEquipo { width: 100%; max-width: 25rem; margin-top: 15px; height: 78%; } .cl_header { border-radius: 20px 20px 0px 0px; text-align: center; background: #954b97; color: white; line-height: 3rem; font-size: 1.2rem; } .cl_main { display: flex; flex-direction: column; height: 100%; background: #fff; border-radius: 0 0 20px 20px; width: 100%; padding: 10px; } .month { width: 95%; height: 2.5rem; background: #0077bb; border-radius: 8px; color: white; font-size: 1rem; display: flex; flex-direction: column; justify-content: center; } .cl_col { width: 100%; height: 9rem; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; text-align: center; justify-items: center; align-self: center; align-items: center; } @media (max-width: 1024px) { #nroCuenta, #nroCuentaFacturasEquipo { width: 7rem !important; } .tablaNcNd-container, .tablaFacturasEquipo-container { width: 56% !important; } .tablaCalipso-container { width: 56% !important; } .tablaSolicitudDescarga-container, .tablaSolicitudDescargaFacturasEquipo-container { width: 40% !important; } #frame-calendario, #frame-calendario-calipso, #frame-calendario-FacturasEquipo { margin-left: 40px !important; } #btnBorrarFiltrosNcNd, #btnBorrarFiltrosFacturasEquipo { width: 7rem; padding: 4px 0px 10px 0px; line-height: 1.4rem; white-space: normal; } #btnBorrarFiltrosCalipso { width: 7rem; } #btnIniciarSolicitudDescarga, #btnIniciarSolicitudDescargaFacturasEquipo { width: 14rem; } #btnsNcNd, #btnsFacturasEquipo { width: 64%; } } @media (max-width: 1600px) { #spanMes, #spanMesFacturasEquipo { width: max-content; } #spanMesCalipso { width: max-content; } #nroClienteCalipso { width: 13rem; } #btnBorrarFiltrosNcNd, #btnBorrarFiltrosFacturasEquipo { white-space: normal; } #btnBorrarFiltrosCalipso { padding: 4px 0px 10px 0px; white-space: normal; width: 7rem; line-height: 1.4rem; } #btnIniciarSolicitudDescarga, #btnIniciarSolicitudDescargaFacturasEquipo { width: 14rem; white-space: normal; padding: 0px; padding-bottom: 4px; } #frame-calendario, #frame-calendario-calipso, #frame-calendario-FacturasEquipo { width: 100%; } } .tooltipx { position: relative; } .tooltipx .tooltiptext { visibility: hidden; width: max-content; max-width: 400px; background-color: #262424; color: #c4c4c4; text-align: center; padding: 3px 15px 4px 15px; position: absolute; z-index: 1; top: -2rem; left: -5.7rem; font-size: 0.85rem; font-weight: 100; line-height: 1.5; } .tooltipx:hover .tooltiptext { visibility: visible; } .tooltipx .tooltiptext.tooltip-white { background: white; color: black; box-shadow: 0px 2px 4px rgb(0 0 0 / 20%); border-radius: 8px; } .tooltipx .tooltiptext.bonificaciones-multiples { position: absolute; left: -250px; top: 10px; font-size: 1.1rem; padding: 20px 30px; } .tooltipx .tooltiptext.bonificaciones-renovacion { left: -135px; top: -15px; padding: 20px; font-size: 0.95rem; max-width: fit-content; } .tooltipx:hover .tooltiptext { visibility: visible; } .lineaActiva { color: #5bc500; } .lineaNoActiva { color: red; } .item-group { border: 1px solid #80808040; padding: 5px 10px; border-radius: 10px; background: #f8f8f8; margin-bottom: 1rem; } .item-group input { background-color: #50535a2b; } .tabsLyS-container { overflow-y: auto; padding-right: 30px; height: calc(100vh * 1.176 - 376px); } #btn-reparacion-equipo:hover #svgServicioTecnico, #btnRobo:hover #svgRobo, #btnTuLinea div:hover #svgVerificacionTecnica, #btnTuLinea div:hover #svgReclamosTecnicos { fill: white; } #btnTuLinea div:hover a { color: white; background-color: #007aa2; } #btnTuLinea #btn-reclamos-container:hover { background-color: #007aa2; } @media (max-width: 2560px) { #infoEquipo-col2 { margin-left: 35%; } } .cards-container svg { width: 50px; margin-bottom: 10px; } .cards-container .card2-container svg { width: 30px; margin-right: 10px; } .cards-container { display: flex; justify-content: space-between; padding: 0 5%; } .card1-container, .card2-container { border: 1px solid #77535a63; display: flex; height: 15rem; width: 48.5%; border-radius: 10px; padding: 5px; } .card1-container a, .card2-container a { color: inherit; text-decoration: none; } /*.card2-container { width: 45%; }*/ .card-gestiona { width: 60% !important; } .card-reportes { width: 40% !important; } .card-reportes .btn-card { width: 50%; } .card-gestiona, .card-reportes, .card-consulta, .card-formularios { width: 50%; } .btn-card { /*border: 1px solid green;*/ display: flex; flex-direction: column; width: fit-content; text-align: center; margin: 0px 10px; } .card2-container .cards-btns { flex-direction: column; } .card2-container .btn-card { flex-direction: row; border-bottom: 1px solid #d3d4d3; width: auto; margin-bottom: 10px; } .card2-container .btn-card span { align-self: center; } .cards-btns { display: flex; margin-top: 40px; } .card-arrow { color: #007aa2; font-size: 20px; margin-left: auto; } @media (max-width: 1280px) { .card1-container, .card2-container { width: 47%; } } .cards-btns ul { list-style: none; padding: 0px; } #lista-0800 li { border-bottom: 1px solid #d3d4d3; color: #50535a; padding: 10px 0; } #lista-0800 li:last-child { border-bottom: none; padding-bottom: 10px; } .banner-comentario { border: 1px solid #d5d5d5; width: fit-content; padding: 5px 50px; border-radius: 10px; margin: auto; } .banner-comentario a { color: #50535a; text-decoration: none; font-weight: bold; } .links-redes-sociales img { width: 40px; } .col2 img, .col3 img { margin-top: 23px; } .col2 h3, .col3 h3 { margin-left: auto; } .links-redes-sociales div { display: flex; justify-content: space-evenly; margin: auto; align-items: center; margin-top: 10px; width: 93%; } .footer-gral ul li a { min-height: 65px; } .footer-container { display: flex; justify-content: space-around; margin-bottom: 15px; } .banner-imagen { display: flex; justify-content: center; align-items: center; } .banner-imagen-container { display: flex; align-items: center; justify-content: center; position: relative; } .banner-imagen-container img { width: 100%; } #btnImgPremium, #btnImgStandar { position: absolute; top: 20rem; left: 16rem; width: 12rem; height: 4rem; font-size: 2rem; padding-bottom: 10px; } @media (max-width: 1024px) { .sm-pad { padding-right: 0px !important; } } @media (min-width: 1024px) { .banner-imagen-container img { width: 95%; } #btnImgPremium, #btnImgStandar { top: 15rem; left: 12rem; } .link-legales { top: 16.8rem !important; left: 25rem !important; } .sm-pad-10 { padding-right: 10px; } .icon-hide { display: none; } .cuenta-container { width: 64% !important; } .table-container { max-height: calc(100vh - 20rem); } #dvComprobante ul li { width: 8rem; text-align: center; align-self: center; } .nav-item-sm { line-height: 3rem; } #btnNuevoUsuario-container { margin-left: 12.5rem !important; } #tabla-usuarios-autorizados, #tabla-historico-usuarios, #tabla-rol-consulta { height: calc(100vh - 12.5rem); } #tabla-gestiones { height: calc(100vh - 16.5rem); } } @media (max-width: 1024px) { #tabla-usuarios-autorizados, #tabla-historico-usuarios, #tabla-rol-consulta { height: calc(100vh - 12.5rem) !important; } #tabla-rol-consulta { width: 74%; } #tabla-gestiones { height: calc(100vh - 16.5rem) !important; } } @media (min-width: 1280px) { #dvComprobante ul li { width: 10rem; text-align: center; align-self: center; } .nav-item-sm { line-height: 3rem; } #btnNuevoUsuario-container { margin-left: 31.5rem !important; } #tab-container { width: 100%; } #tabla-rol-consulta { width: 53%; } #tabla-usuarios-autorizados, #tabla-historico-usuarios, #tabla-rol-consulta { height: 71vh !important; } #tabla-gestiones { height: calc(100vh - 16.5rem) !important; } } @media (min-width: 1360px) { #dvComprobante ul li { width: initial; text-align: center; align-self: center; } .nav-item-sm { line-height: inherit; } #tablas-container-md { width: 100%; } #tabla-rol-consulta { width: 100%; } #btnNuevoUsuario-container { margin-left: auto !important; } #tabla-usuarios-autorizados, #tabla-historico-usuarios, #tabla-rol-consulta { height: calc(100vh - 17.5rem) !important; } #tabla-gestiones { height: calc(100vh - 15.5rem) !important; } .card-user-img { padding-left: 5%; } } @media (min-width: 1600px) { #dvComprobante ul li { width: initial; text-align: center; align-self: center; } .nav-item-sm { line-height: inherit; } #tabla-usuarios-autorizados, #tabla-historico-usuarios, #tabla-rol-consulta { height: 67vh !important; } #tabla-gestiones { height: calc(100vh - 13.5rem) !important; } #btnNuevoUsuario-container { margin-left: auto !important; } #dashboard-row-1 { max-width: 1400px; } #tkt-desc { max-height: 18rem !important; } #filtros-container, #filtros-container + .items-holderl { width: 79% !important; } .tabla_0800 { max-height: 47vh !important; } .tablaNcNd-container { max-height: 61vh !important; } } @media (min-width: 1920px) { #dvComprobante ul li { width: initial; text-align: center; align-self: center; } .nav-item-sm { line-height: inherit; } #tablas-container-md { width: 100%; } #tabla-usuarios-autorizados, #tabla-historico-usuarios, #tabla-rol-consulta { height: 86.5vh !important; } #tabla-gestiones { height: calc(100vh - 12rem) !important; } .tablaNcNd-container { max-height: 72vh !important; } } .link-legales { position: absolute; top: 22rem; left: 30rem; } #dvComprobante table { table-layout: fixed; } #dvComprobante table thead { position: sticky; top: 0; background: #f8f8f8; z-index: 1; } #dvComprobante .table-container { overflow-y: overlay; } #btnNuevoUsuario:hover { color: #fff !important; } #btnNuevoUsuario:hover .svgUsuario { fill: #fff; } .frame-container { display: flex; padding: 20px 16px 0px 20px; } /* #bloqueInformativo { display: flex; flex-direction: column; }*/ #buscador-parque, #buscador-roles, #tabla-usuarios-autorizados input { color: #50535a; background-color: #e9eae8; border: 1px solid transparent; font-family: "TelefonicaLight", sans-serif; font-size: 16px; padding: 5px 5px 0px 5px; border-radius: 5px; min-height: 48px; width: 9rem; } #buscador-parque, #buscador-roles { padding: 0px 0px 0px 20px; border-radius: 5px; min-height: 48px; width: 20rem; } #buscador-parque::placeholder, #buscador-roles::placeholder { color: #b6b7b7; } #buscador-parque:focus, #buscador-roles:focus { outline: none; -webkit-box-shadow: inherit; box-shadow: inherit; background-color: #f8f8f8; border: 1px solid #e9eae8; } #buscador-gestiones { padding: 0px 0px 0px 20px; border-radius: 5px; min-height: 48px; width: 22rem; color: #50535a; background-color: #e9eae8; border: 1px solid transparent; font-size: 16px; } #buscador-gestiones::placeholder { color: #b6b7b7; } #buscador-gestiones:focus { outline: none; -webkit-box-shadow: inherit; box-shadow: inherit; background-color: #f8f8f8; border: 1px solid #e9eae8; } #tabla-usuarios-autorizados input:focus { color: #50535a; background-color: #ffffff; border-color: #007aa2; outline: 0; -webkit-box-shadow: none; box-shadow: none; } #tabla-usuarios-autorizados input { min-height: 41px; width: 100%; } #btnLupa, #btnCruz { align-self: center; border-bottom-left-radius: 0px; border-top-left-radius: 0px; } #btnLupa { padding: 6px 10px; } #btnCruz { padding: 3px 0px; } #btnCruz img { vertical-align: text-top; padding: 5px 7px; } #btnLupa img { vertical-align: sub; } .tab-inactive { color: #495057; border-color: #e9eae8 #d3d4d3 #e9eae8 !important; background: #f5f5f582; } .tab-active { color: #007aa2 !important; border-color: #d3d4d3 #d3d4d3 #ffffff !important; font-family: 'TelefonicaBold', sans-serif; } #tabla-parque-movil-container table, #tabla-parque-fijo-container table, #tabla-usuarios-autorizados table, #tabla-historico-usuarios table { table-layout: fixed; text-align: center; } #tabla-parque-fijo th { padding: 1.5em 0; } #tabla-gestiones table { table-layout: fixed; text-align: center; } #tabla-rol-consulta table { text-align: center; } #tabla-parque-movil-container table th, #tabla-parque-fijo-container table th, #tabla-usuarios-autorizados table th, #tabla-historico-usuarios table th { vertical-align: middle; } #tabla-gestiones table th { vertical-align: middle; } #tabla-parque-movil-container th, #tabla-parque-fijo-container th, #tabla-usuarios-autorizados th, #tabla-historico-usuarios th, #tabla-rol-consulta th { color: white; background-color: #007aa2; position: sticky; top: 0; z-index: 1; } #tabla-gestiones th { color: white; background-color: #007aa2; position: sticky; top: 0; z-index: 1; } .td-padding { padding: 10px 10px !important; } tr { word-break: break-word; } @media (max-width: 1024px) { #rolesUsuariosContent { justify-content: space-evenly; } #gestionesContent { justify-content: space-evenly; } } #tabGrillaFacturacion { border-bottom: none; } #tabs-roles li, #tabGrillaFacturacion li { text-align: center; } #tabGrillaFacturacion li .nav-link { padding: 0.5rem .8rem; } .icoEliminar, .icoEditar, .icoConfirmar, .icoCancelar { cursor: pointer; } .field-error { border: solid 2px red !important; background-color: white !important; } .icoConfirmar.mdi::before, .icoCancelar.mdi::before { padding-top: 7px; } .thead-gestion { width: 8rem; } #thTipoDoc { width: 11rem; } #thAlias { width: 7rem; } #thDocumento { width: 9rem; } #thGenero { width: 9rem; } #thEmail { width: 18rem; } #thRol { width: 9rem; } #thIconos { width: 4rem; } .dropdown button:focus { color: #ffffff; background-color: #50535a; border-color: #50535a; } .svg-disabled { color: gray !important; } #spanSinResultados { display: none; margin-left: 1rem; margin-top: auto; margin-bottom: auto; } .dropdown-item { cursor: pointer; } .notification { background-color: #f2f2f2; min-height: 40px; border-radius: 10px; line-height: 1.5rem; width: 507px; padding: 5px 15px 15px 15px; font-size: medium; position: relative; } .notification.config { min-width: unset; } .btn-descartar-notificaciones { background-color: red; color: white; } .bell-notificaciones { color: gray; } .checkbox-config-notificaciones.active, .checkbox-config-notificaciones.active > * { pointer-events: none !important; } .checkbox-config-notificaciones.active input:checked + .slider { background-color: gray; } .checkbox-config-notificaciones.active .slider { background-color: gray; } .number-circle { position: absolute; top: 0; left: 20px; background-color: #EC130E; color: white; font-size: 0.7rem; border-radius: 50%; width: 18px; height: 18px; display: flex; justify-content: center; align-items: center; } .number-circle.sm { width: 15px; height: 15px; padding-left: 5px; justify-content: unset; } .number-circle.xsm { width: 14px; height: 14px; left: 14px; font-size: 0.6rem; padding-top: 1px; } /* The switch - the box around the slider */ .switch { position: relative; display: inline-block; width: 60px; height: 34px; } /* Hide default HTML checkbox */ .switch input { opacity: 0; width: 0; height: 0; } /* The slider */ .slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; -webkit-transition: 0.4s; transition: 0.4s; } .slider:before { position: absolute; content: ""; height: 26px; width: 26px; left: 4px; bottom: 4px; background-color: white; -webkit-transition: 0.4s; transition: 0.4s; } input:checked + .slider { background-color: #2196f3; } input:focus + .slider { box-shadow: 0 0 1px #2196f3; } input:checked + .slider:before { -webkit-transform: translateX(26px); -ms-transform: translateX(26px); transform: translateX(26px); } /* Rounded sliders */ .slider.round { border-radius: 34px; } .slider.round:before { border-radius: 50%; } .solo-input { /*-webkit-box-flex: 1; -ms-flex: 1; flex: 1;*/ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .solo-input input { color: #50535a; border: none; background-color: #e9eae8; background-position: calc(100% - 15px) center; background-repeat: no-repeat; background-clip: padding-box; border: 1px solid transparent; font-family: "TelefonicaLight", sans-serif; font-size: 16px; padding: 0 40px 0 20px; border-radius: 5px; min-height: 48px; width: 100%; -webkit-transition: all 0.25s ease-in; transition: all 0.25s ease-in; } .solo-input input::-webkit-input-placeholder { color: #b6b7b7; } .solo-input input:-ms-input-placeholder { color: #b6b7b7; } .solo-input input::-ms-input-placeholder { color: #b6b7b7; } .solo-input input::placeholder { color: #b6b7b7; } .solo-input input:focus { outline: none; -webkit-box-shadow: inherit; box-shadow: inherit; background-color: #f8f8f8; border: 1px solid #e9eae8; } .solo-input textarea { color: #50535a; border: none; background-color: #e9eae8; border: 1px solid transparent; font-family: "TelefonicaLight", sans-serif; font-size: 16px; padding: 20px; border-radius: 5px; min-height: 80px; width: 100%; -webkit-transition: all 0.25s ease-in; transition: all 0.25s ease-in; } .solo-input textarea::-webkit-input-placeholder { color: #b6b7b7; } .solo-input textarea:-ms-input-placeholder { color: #b6b7b7; } .solo-input textarea::-ms-input-placeholder { color: #b6b7b7; } .solo-input textarea::placeholder { color: #b6b7b7; } .solo-input textarea:active { outline: none; -webkit-box-shadow: inherit; box-shadow: inherit; } .solo-input textarea:focus { outline: none; -webkit-box-shadow: inherit; box-shadow: inherit; background-color: #f8f8f8; border: 1px solid #e9eae8; } .solo-input.width-auto { width: inherit; } .solo-input.width-auto input { margin-right: 20px; width: 50%; } .solo-input.buscador { /*margin-left: 35px;*/ background-position: center; min-height: 43px; border-bottom-left-radius: 0px; border-top-left-radius: 0px; background-clip: padding-box; background-position: right center; } .solo-input.buscador button { min-height: 43px; border-bottom-left-radius: 0px; border-top-left-radius: 0px; background-clip: padding-box; background-position: right center; } .solo-input.filtro input { background-image: url(/Content/assets/img/filter_blue.svg); background-position: right center; } .arrow-hide::after { visibility: hidden; } .menu-cruz { /*margin-left: -5px;*/ } .grab { cursor: grab; } .grabbing { cursor: grabbing; } .cursor-not-allowed { cursor: not-allowed !important; } .btn-not-allowed { color: white; box-shadow: none !important; background-color: #bcbcbc; border-color: #cfd3dd7d; } .btn-not-allowed, .btn-not-allowed:hover { color: white; box-shadow: none !important; background-color: #bcbcbc !important; border-color: #cfd3dd7d; } .monto-spinner { display: none; width: 30px; vertical-align: text-bottom; position: absolute; top: 8px; left: 10px; } .show-cartel-informativo { opacity: 1 !important; z-index: 1; display: flex !important; } #info-container { position: absolute; display: flex; flex-direction: column; justify-content: flex-start; gap: 4px; height: 25rem; background: #fff; border: 1px solid #d3d4d3; padding: 8px; opacity: 0; } #info-container p { margin: 0; } #info-container div { display: flex; justify-content: flex-start; align-items: center; gap: 8px; margin-left: 7rem; margin-bottom: 4px; } #info-container div svg, #info-container div img { width: 22px; } #info-container div i { color: #00a9e0; font-size: 25px; height: 24px; margin: -15px 2px 0 -3px; } .info-container { opacity: 0; border: 1px solid #d3d4d3; position: absolute; background: #fff; padding: 8px; display: none; flex-direction: column; /*height: auto;*/ /*justify-content: space-around;*/ } .circulo-verde { border: 5px solid #42c353; border-radius: 50%; height: 10rem; width: 10rem; display: flex; flex-direction: column; justify-content: center; position: relative; } #info-ico-pl:hover + #info-container-pl { display: flex !important; } .info-plan-item { text-align: left; display: flex; margin-bottom: 10px; } .info-plan-item span { font-size: 16px !important; } .titulo-pl { color: #50535a; font-family: "TelefonicaBold", sans-serif; font-size: 18px; margin: 0 0 5px; text-align: center; } .custom-spinner { border-radius: 50%; animation: spinner 1s linear infinite; } @keyframes spinner { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .detalle-plan-float { position: absolute; top: 30px; right: 0; } .scroll-y { overflow-y: scroll !important; height: calc(100vh - 3rem); } @media (min-width: 1600px) { .scroll-y { height: calc(100vh - 3rem); } } @media (min-width: 1920px) { .scroll-y { height: calc(100vh - 3rem); } } .hide-text { color: transparent !important; } #menu-notificaciones svg:hover { transform: rotate(88deg) !important; } .i-desplegable.month-enabled:hover { filter: drop-shadow(2px 4px 6px black); transform: scale(1.2); transition: 200ms; } .leftArrowYear, .rightArrowYear { cursor: pointer; } .arrowDisabled { pointer-events: none; opacity: 0; } .filtro-selected { background: #ffffff !important; box-shadow: 0px 0px 10px 0px #989595; opacity: 1 !important; border-top-left-radius: 15px; border-top-right-radius: 15px; } #filtro-movil.filtro-selected { border-bottom: 5px solid #914b93 !important; } #filtro-movil.filtro-selected span { color: #914b93 !important; font-family: 'TelefonicaBold', sans-serif; } #filtro-fijo.filtro-selected { border-bottom: 5px solid #007aa2 !important; } #filtro-fijo.filtro-selected span { color: #007aa2 !important; font-family: 'TelefonicaBold', sans-serif; } #filtro-digitales.filtro-selected { border-bottom: 5px solid #53bf02 !important; } #filtro-digitales.filtro-selected span { color: #378200 !important; font-family: 'TelefonicaBold', sans-serif; } #filtro-sua.filtro-selected { border-bottom: 5px solid #41b6f7 !important; } #filtro-sua.filtro-selected span { color: #2a7caa !important; font-family: 'TelefonicaBold', sans-serif; } #filtro-otros.filtro-selected { border-bottom: 5px solid #7c7e83 !important; } #filtro-otros.filtro-selected span { color: #6f7175 !important; font-family: 'TelefonicaBold', sans-serif; } nav#navFacturacion > div { width: 11rem; border: 1px solid #d3d4d3; border-top-left-radius: 15px; border-top-right-radius: 15px; margin-right: 0px; position: relative; } nav#navFacturacion > div a { display: flex; justify-content: center; align-items: center; gap: 8px; opacity: 0.7; } nav#navFacturacion > div a img { opacity: 0.7; } nav#navFacturacion > div a.filtro-selected img { opacity: 1; } #navFacturacion { display: flex; width: 100%; margin-top: -5px; } #navFacturacion a { height: 100%; width: 100%; display: flex; align-items: center; justify-content: center; } nav#navLyS > div { width: 13rem; border: 1px solid #d3d4d3; border-top-left-radius: 15px; border-top-right-radius: 15px; margin-right: 0px; position: relative; } nav#navLyS > div a img { opacity: 0.7; } nav#navLyS > div a.filtro-selected img { opacity: 1; } nav#navLyS > div a { display: flex; justify-content: center; align-items: center; gap: 8px; opacity: 0.7; } #navLyS { display: flex; width: 100%; margin-left: 8px; margin-top: -5px; } #navLyS a { height: 100%; width: 100%; display: flex; align-items: center; justify-content: center; } .items-links { position: absolute; max-height: calc(100vh * 1.176 - 330px); overflow-y: auto; z-index: 99; width: 20rem; top: 5rem; left: 0rem; } .items-links.items-holderf h3 { font-size: 16px !important; padding-bottom: 0 !important; } .layoutFiltros { cursor: pointer; } .layoutFiltros span { color: black; } #data-cliente h3 { color: #86888c; font-size: 24px; font-family: "TelefonicaLight", sans-serif; } #data-cliente-alias[data-show='false'] { opacity: 0; } #data-alias-linea span { font-size: 1.2rem; } @media (min-width: 1920px) { .texto-pagalos { top: 72% !important; left: 39% !important; } #tabla-parque-movil { width: 100% !important; } } a#tab-todas.active span, a#tab-canceladas.active span, a#tab-abiertas.active span, a#tab-enresolucion.active span, a#tab-cerradas.active span, a#tab-borrador.active span { font-family: 'TelefonicaBold'; } #img-elegi-tu-movil:hover, #img-footer:hover { transform: scale(1.1); } .links-redes-sociales img:hover { transform: scale(1.5); } .td-banner { position: absolute; transform: translate(-50%, -50%); font-weight: bold; top: 22%; left: 65%; color: white; width: 55%; text-align: center; } #btn-suspender-linea:hover { background-color: #BD3373 !important; } .btn-alias { box-shadow: 0 2px 2px 0 rgb(0, 0, 0, 0.14), 0 1px 5px 0 rgb(0, 0, 0, 0.12), 0 3px 1px -2px rgb(0, 0, 0, 0.2); } .bck-warning-msj { position: relative; z-index: 999; background-color: #0077bb !important; } .bck-warning-msj span { color: white !important; } b, strong { /*font-family: 'TelefonicaBold';*/ font-weight: 900; } .ticket-type { color: white !important; margin-top: 5px; display: inline-block; padding: 0px 3px 3px 3px; font-weight: 600; } .ticket-type.bg-success { background-color: #3b7d02 !important; } .ticket-type.bg-orange { background-color: #cb3804 !important; } /* Suspension por robo (texto boton) */ @media (max-width: 1600px) { #btn-suspender-linea span { font-size: 1.3rem !important; } #tabla-parque-movil { width: 120% !important; } } @media (max-width: 1366px) { #btn-suspender-linea span { font-size: 1.1rem !important; } .tablaCalipso-container { max-height: 43vh !important; } #tblHistorico { width: 120% !important; } } @media (max-width: 1280px) { #btn-suspender-linea span { font-size: 1rem !important; } } /* Cambio de contraste de colores por accesibilidad. */ .btn-success { background-color: #3c8700; } .btn-primary { background-color: #007aa2; color: #fff; } .btn-outline-success { background-color: transparent; } .btn-outline-primary { color: #007aa2; } .btn-outline-primary:hover { color: #ffffff !important; background-color: #007ca4; border-color: #007ca4; } .btn-outline-info { color: #118294; } .bg-primary { background-color: #007aa2 !important; } .btn-off.link-off { color: white !important; } .btn-off.link-off svg path { fill: white; } .btn-primary:hover { background-color: #007ca4 !important; } /*--------------------------------------------------------------*/ .checkbox-error { outline: 3px solid red; } #btn-lineas-bajas:hover { -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2); box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 1px 5px 0 rgb(0 0 0 / 12%), 0 3px 1px 2px rgb(0 0 0 / 20%); } .show { visibility: initial; } .hide { visibility: hidden; transform: translateX(-100%); } @media (min-width: 1920px) { #btnTuLinea { flex-direction: row !important; } } .disabled { cursor: not-allowed !important; color: white !important; background-color: #737373 !important; pointer-events: none; } .item-linea { font-size: 16px; background-color: #f8f8f8; color: #50535a; padding: 15px; border-bottom: 1px solid #d3d4d3; } .item-linea-active { font-family: 'TelefonicaBold'; font-size: 15px; } .item-linea-active span { font-family: 'TelefonicaBold'; } .arrow-down { transform: rotate(180deg); } #listadoLineasContainer { max-height: 20rem; overflow-y: auto; position: absolute; width: 100%; z-index: 9; } .bd-navbar { padding: 25px; padding-left: 39px; } .bd-navbar.min-header { min-height: 40px; } .bd-navbar.min-header .navbar-brand { padding: 0; } .bd-navbar.min-header .navigation__logo--svg { max-width: 28px; } .bd-navbar.min-header .navigation__logo-text--svg { display: none; } .spinner { z-index: 1000; width: 100vw; height: 400px; background-color: #FFF; display: flex; flex-direction: column; align-items: center; justify-content: center; } .redactar-gestion-holder .redactar-box { min-width: 570px; } /* Botones de la nueva gestión */ .btn.btn-lg, .btn-group-lg > .btn { border-radius: 5px; cursor: pointer; font-family: "TelefonicaLight", sans-serif; font-size: 18px; line-height: 36px; padding: 2px 22px 6px; text-decoration: none; } .btn-outline-success.selected { color: #ffffff; background-color: #5bc500; border-color: #5bc500; } #btn-pedido.btn-outline-success.selected { color: #ffffff; background-color: #3c8700; border-color: #3c8700; } .btn-outline-primary.selected { color: #ffffff; background-color: #00a9e0; border-color: #00a9e0; } .btn-outline-orange.selected { color: #ffffff; background-color: #ec6839; border-color: #ec6839; } /* fin de botones de nueva gestión */ .btn-link:hover, .btn-link:active { text-decoration: none; } #logo-movistar-svg { fill: currentColor; color: #019DF4; } .navigation__logo-text--svg { display: block; fill: currentColor; color: #019df4; margin-left: 12px; overflow: hidden; } .custom-btn-secondary-inverse { color: #FFFFFF !important; background: transparent; border: 1px solid #FFFFFF; height: 48px; font-size: 1rem; padding: 0px 15px; display: flex; } .custom-btn-secondary-inverse svg { width: 19px; } .custom-btn-secondary-inverse span:nth-child(2) { display: flex; border-radius: 4px; height: 24px; align-self: center; align-items: center; padding-bottom: 4px; margin-left: 10px; } .custom-btn-secondary-inverse:hover span:nth-child(2) { color: var(--bluePrimary) !important; } .custom-btn-secondary-inverse:hover { color: transparent !important; background: #FFFFFF; } .custom-btn-secondary-inverse:hover path:nth-child(1) { fill: var(--bluePrimary) !important; } #maincontent { zoom: 85%; height: calc(100vh * 1.176 - 217px); } .btn-descarga-xlsx:hover { color: #ffffff !important; background-color: #007ca4 !important; border-color: #007ca4; } /*Ajustes ancho y padding para tabla Facturas de equipos */ @media (max-width: 1600px) { .col-fija { width: 105px; } .rdBtn.col-fija { width: 65px; } .padding-fix { padding: 0.75rem 0.4rem !important; } } /*--- Detalle de llamadas */ /** Se agrega altura para mostrar mensaje busqueda y filtros*/ #filtros-container.filtros-fix-height { height: 135px !important; } /** Se quita altura para evitar scroll por mostrar mensaje busqueda*/ .items-holderl.items-holderl-fix-height { max-height: calc(100vh * 1.176 - 435px) !important; } /*--- Fin */ /* Medios de pago */ .modal-medio-pago-box { display: flex; justify-content: space-evenly; } .modal-medio-pago-box-option { text-align: center; height: 150px; width: 150px; border: 1px solid var(--clr-border-2); border-radius: var(--border-radius); padding: 16px 16px 26px; margin: 0 1rem; position: relative; cursor: pointer; } .modal-medio-pago-box-option:hover { border: 2px solid #007ACD; } .modal-medio-pago-box-option span { color: #50535A; font-weight: 600; position: absolute; width: 100%; left: 0; bottom: 25px; } .modal-medio-pago-close { position: absolute; top: -8px; right: 36px; cursor: pointer; font-size: 48px; color: #007ACD; } #top-header #logoInicio img { width: 130px; height: 130px; } /* Integracion */ #spinner_integration { position: absolute; display: flex; justify-content: center; width: 100%; height: 100%; background: white; z-index: 9999; } #loadingDescIntegracion { text-align: center; margin-top: 15%; font-size: 28px; line-height: 32px; width: 400px; font-family: 'Telefonica', sans-serif; } /* Progress Bar */ .progress { position: relative; height: 4px; display: block; width: 100%; background-color: rgb(128, 206, 249); border-radius: 2px; background-clip: padding-box; margin: 0.5rem 0 1rem 0; overflow: hidden; margin-top: 7%; } .progress .indeterminate { background-color: rgb(0, 142, 221); } .progress .indeterminate:before { content: ''; position: absolute; background-color: inherit; top: 0; left: 0; bottom: 0; will-change: left, right; -webkit-animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite; animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite; } .progress .indeterminate:after { content: ''; position: absolute; background-color: inherit; top: 0; left: 0; bottom: 0; will-change: left, right; -webkit-animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite; animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite; -webkit-animation-delay: 1.15s; animation-delay: 1.15s; } #exit-buttons{ width:195px; } @-webkit-keyframes indeterminate { 0% { left: -35%; right: 100%; } 60% { left: 100%; right: -90%; } 100% { left: 100%; right: -90%; } } @keyframes indeterminate { 0% { left: -35%; right: 100%; } 60% { left: 100%; right: -90%; } 100% { left: 100%; right: -90%; } } @-webkit-keyframes indeterminate-short { 0% { left: -200%; right: 100%; } 60% { left: 107%; right: -8%; } 100% { left: 107%; right: -8%; } } @keyframes indeterminate-short { 0% { left: -200%; right: 100%; } 60% { left: 107%; right: -8%; } 100% { left: 107%; right: -8%; } } /* Telefonica fonts */ @font-face { font-family: "TelefonicaItalic"; src: url(/assets/fonts/telefonica/telefonica-regularitalic-webfont.eot); src: url(/assets/fonts/telefonica/telefonica-regularitalic-webfont.eot?#iefix) format("embedded-opentype"), url(/assets/fonts/telefonica/telefonica-regularitalic-webfont.woff2) format("woff2"), url(/assets/fonts/telefonica/telefonica-regularitalic-webfont.woff) format("woff"), url(/assets/fonts/telefonica/telefonica-regularitalic-webfont.ttf) format("truetype"), url(/assets/fonts/telefonica/telefonica-regularitalic-webfont.svg#telefonicaitalic) format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: "TelefonicaBold"; src: url(/assets/fonts/telefonica/telefonica-bold-webfont.eot); src: url(/assets/fonts/telefonica/telefonica-bold-webfont.eot?#iefix) format("embedded-opentype"), url(/assets/fonts/telefonica/telefonica-bold-webfont.woff2) format("woff2"), url(/assets/fonts/telefonica/telefonica-bold-webfont.woff) format("woff"), url(/assets/fonts/telefonica/telefonica-bold-webfont.ttf) format("truetype"), url(/assets/fonts/telefonica/telefonica-bold-webfont.svg#telefonicabold) format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: "TelefonicaLight"; src: url(/assets/fonts/telefonica/telefonica-light-webfont.eot); src: url(/assets/fonts/telefonica/telefonica-light-webfont.eot?#iefix) format("embedded-opentype"), url(/assets/fonts/telefonica/telefonica-light-webfont.woff2) format("woff2"), url(/assets/fonts/telefonica/telefonica-light-webfont.woff) format("woff"), url(/assets/fonts/telefonica/telefonica-light-webfont.ttf) format("truetype"), url(/assets/fonts/telefonica/telefonica-light-webfont.svg#telefonicalight) format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: "TelefonicaExtraLight"; src: url(/assets/fonts/telefonica/telefonica-extralight-webfont.eot); src: url(/assets/fonts/telefonica/telefonica-extralight-webfont.eot?#iefix) format("embedded-opentype"), url(/assets/fonts/telefonica/telefonica-extralight-webfont.woff2) format("woff2"), url(/assets/fonts/telefonica/telefonica-extralight-webfont.woff) format("woff"), url(/assets/fonts/telefonica/telefonica-extralight-webfont.ttf) format("truetype"), url(/assets/fonts/telefonica/telefonica-extralight-webfont.svg#telefonicaextralight) format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: "TelefonicaCapRegular"; src: url(/assets/fonts/telefonica/telefonicacap-regular-webfont.eot); src: url(/assets/fonts/telefonica/telefonicacap-regular-webfont.eot?#iefix) format("embedded-opentype"), url(/assets/fonts/telefonica/telefonicacap-regular-webfont.woff2) format("woff2"), url(/assets/fonts/telefonica/telefonicacap-regular-webfont.woff) format("woff"), url(/assets/fonts/telefonica/telefonicacap-regular-webfont.ttf) format("truetype"), url(/assets/fonts/telefonica/telefonicacap-regular-webfont.svg#telefonica_capregular) format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: "TelefonicaRegular"; src: url(/assets/fonts/telefonica/telefonica-regular-webfont.eot); src: url(/assets/fonts/telefonica/telefonica-regular-webfont.eot?#iefix) format("embedded-opentype"), url(/assets/fonts/telefonica/telefonica-regular-webfont.woff2) format("woff2"), url(/assets/fonts/telefonica/telefonica-regular-webfont.woff) format("woff"), url(/assets/fonts/telefonica/telefonica-regular-webfont.ttf) format("truetype"), url(/assets/fonts/telefonica/telefonica-regular-webfont.svg#telefonicaregular) format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: "TelefonicaHand"; src: url(/assets/fonts/telefonica/telefonica-hand-webfont.eot); src: url(/assets/fonts/telefonica/telefonica-hand-webfont.eot?#iefix) format("embedded-opentype"), url(/assets/fonts/telefonica/telefonica-hand-webfont.woff2) format("woff2"), url(/assets/fonts/telefonica/telefonica-hand-webfont.woff) format("woff"), url(/assets/fonts/telefonica/telefonica-hand-webfont.ttf) format("truetype"), url(/assets/fonts/telefonica/telefonica-hand-webfont.svg#telefonicahand) format("svg"); font-weight: normal; font-style: normal; } /* FONTS: San Francisco PRO, Roboto & Telefonica Sans */ @font-face { font-family: "TelefonicaSans"; src: url(/assets/fonts/nuevas/TelefonicaWeb-Regular.eot); src: url(/assets/fonts/nuevas/TelefonicaWeb-Regular.eot?#iefix) format("embedded-opentype"), url(/assets/fonts/nuevas/TelefonicaWeb-Regular.woff2) format("woff2"), url(/assets/fonts/nuevas/TelefonicaWeb-Regular.woff) format("woff"), url(/assets/fonts/nuevas/TelefonicaWeb-Regular.ttf) format("truetype"), url(/assets/fonts/nuevas/TelefonicaWeb-Regular.svg#telefonicasans) format("svg"); } @font-face { font-family: "TelefonicaSansBold"; src: url(/assets/fonts/nuevas/TelefonicaWeb-Bold.eot); src: url(/assets/fonts/nuevas/TelefonicaWeb-Bold.eot?#iefix) format("embedded-opentype"), url(/assets/fonts/nuevas/TelefonicaWeb-Bold.woff2) format("woff2"), url(/assets/fonts/nuevas/TelefonicaWeb-Bold.woff) format("woff"), url(/assets/fonts/nuevas/TelefonicaWeb-Bold.ttf) format("truetype"), url(/assets/fonts/nuevas/TelefonicaWeb-Bold.svg#telefonicasansbold) format("svg"); } @font-face { font-family: "SF Pro Display"; src: url(/assets/fonts/nuevas/SF-Pro-Display-Light.otf) format('opentype'); } @font-face { font-family: "SF Pro Text"; src: url(/assets/fonts/nuevas/SF-Pro-Text-Medium.otf) format('opentype'); } /* Colors & vars */ :root { --clr-primary: #914B93; --clr-primary-hover: #954B97; --clr-primary-disabled: #FEDBFF; --clr-secondary: #E9EAE8; --clr-blue-movistar: #007ACD; --clr-white: #FFF; --clr-text: #313235; --clr-text-footer: #433C3C; --clr-text-sub: #313235; --clr-tkt-open: #009C8C; --clr-tkt-resolution: #F28D15; --clr-tkt-close: #C7C4C4; --clr-tkt-cancel: #B63D1F; --clr-saldo-a-pagar: #E62E00; --clr-monto-a-pagar: #504F4F; --clr-saldo-al-dia: #5CB615; --clr-border: #D6D6D6; --clr-border-2: #DDD; --bg-noti: #FF0202; --height-header: 184px; --size-sm: 14px; --size-md: 16px; --size-lg: 24px; --size-xl: 32px; --font-bold: 900; --vel-trans: 0.4s; --border-radius: 4px; --lupaSize: 0px; --lupaTop: 0px; --lupaLeft: 0px; --lupaTooltipTop: 0px; --lupaTooltipLeft: 0px; --offsetX: 0px; --offSetY: 0px; --clr-title-richtext: #313235; } *, *::before, *::after { -webkit-box-sizing: border-box; box-sizing: border-box; } * { margin: 0; padding: 0; font-family: 'TelefonicaLight', sans-serif; } body { color: var(--clr-text); font-size: var(--size-md); } .container .error-page h2, .container .error-page p, .container .error-page span { font-family: 'Roboto', 'TelefonicaLight', sans-serif !important; } .dash-gap { gap: 30px; } .dash-margin { margin: 16px 0; } /* TEXTOS */ .text-data { font-weight: var(--font-bold); color: var(--clr-text); } .text-subdata { font-size: var(--size-sm); color: #313235; } .text-secondary { font-size: var(--size-sm); color: #504F4F; } .text-monto { font-family: 'Roboto', sans-serif; font-size: 32px; font-weight: 300; line-height: 40px; color: var(--clr-monto-a-pagar); } .text-monto.al-dia { color: var(--clr-saldo-al-dia); } .dash-link { color: var(--clr-blue-movistar); font-weight: var(--font-bold); text-decoration: none; } .dash-link.btn-disabled { opacity: .5; } .link-notificaciones { color: #0071c5; } .dash-link:hover { color: var(--clr-blue-movistar); text-decoration: none; } .dash-link.dash-disabled { cursor: no-drop; } .dash-link.toOrders { font-weight:500; font-size:18px; } h2 { font-size: var(--size-lg); margin: 16px 0; font-weight: var(--font-bold); } /* BOTONES */ .btn-header { background-color: transparent; border: 2px solid #fff; } .btn-header span { position: relative; top: 2px; margin-left: 8px; color: #fff; } .btn-header:hover, .btn-header:active { background-color: #fff; text-decoration: none; } .btn-header:hover span, .btn-header:active span { color: var(--clr-blue-movistar); } .btn-header:focus { outline: 0; } .btn-header.btn-ticket:hover svg path { fill: var(--clr-blue-movistar); } .btn-b2b { border-radius: 4px; cursor: pointer; font-size: var(--size-md); padding: 8px 16px 11px; text-decoration: none; transition: 0.4s; } .btn-b2b svg, .btn-b2b i, .btn-b2b span { position: relative; top: -2px; } .btn-b2b span { margin-left: 8px; } .btn-b2b-sm { font-size: var(--size-sm); padding: 6px 8px; } .btn-b2b-primary { background-color: var(--clr-primary); color: #fff; border: 1px solid var(--clr-primary); } .btn-b2b-primary:hover, .btn-b2b-primary:active { background-color: #7C337E; border: 1px solid #7C337E; } .btn-b2b-primary:focus { outline: 0; } .btn-b2b-secondary { background-color: #fff; color: var(--clr-primary); border: 1px solid var(--clr-primary); } .btn-b2b-secondary:hover, .btn-b2b-secondary:active { background-color: var(--clr-primary); border: 1px solid var(--clr-primary); color: #fff; } .btn-b2b-secondary:hover svg path, .btn-b2b-secondary:active svg path { fill: #fff; } .btn-b2b-secondary:focus { outline: 0; } .btn-b2b-primary:disabled { background-color: #C796C9; border-color: #C796C9; cursor: not-allowed; } .btn-b2b-secondary:disabled { color: #C796C9; background-color: transparent; border-color: #C796C9; cursor: not-allowed; } .btn-b2b-secondary:disabled svg path { fill: #C796C9; } .btn-b2b-blue-movistar { background-color: var(--clr-blue-movistar); color: #fff; border: 1px solid var(--clr-blue-movistar); } .btn-b2b-blue-movistar svg { margin-right: 8px; } .btn-b2b-blue-movistar svg path { fill: white; } .btn-b2b-blue-movistar:hover, .btn-b2b-blue-movistar:active { background-color: #E6F5FD; color: #005A99; border: 1px solid #005A99; } .btn-b2b-blue-movistar:hover svg path { fill: #005A99 } .btn-b2b-blue-movistar:focus { outline: 0; color: #005A99; background-color: #E6F5FD; border: none; } .btn-b2b-blue-movistar:focus svg path { fill: #005A99; } /* SPINNER */ .b2b-spinner { margin-right: 8px; } /* LISTAS */ .b2b-list { display: flex; flex-direction: column; margin: 0; padding: 0; } .b2b-list li { display: flex; justify-content: space-between; align-items: center; padding: 8px; font-weight: var(--font-bold); color: var(--clr-blue-movistar); border-bottom: 1px solid #dddddd; cursor: pointer; } .b2b-list li:last-child { border: none } .b2b-list li a { display: flex; justify-content: space-between; align-items: center; color: var(--clr-blue-movistar); font-weight: var(--font-bold); width: 100%; text-decoration: none; } .b2b-list li a span i, .b2b-list li a span svg { margin-right: var(--size-md); width: var(--size-md); text-align: center; } .b2b-list li a span svg path { fill: var(--clr-blue-movistar); } /* MODAL */ .modal-dialog { max-width: 485px; } .modal-content { border-radius: 10px; } .modal-header-b2b { position: relative; display: flex; justify-content: center; align-items: center; background: var(--clr-blue-movistar); color: #fff; font-size: 20px; padding: 16px 36px; border-radius: 10px 10px 0 0; } .modal-header-b2b span { position: absolute; top: -8px; right: 36px; cursor: pointer; font-size: 48px; } .modal-body-b2b { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 8px; padding: 8px 40px; background: #fff; } .modal-body-b2b .modal-item-b2b { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; width: 100%; } .modal-body-b2b .modal-item-b2b label { color: var(--clr-text); } .modal-body-b2b .modal-item-b2b input { width: 100%; font-weight: var(--font-bold); padding: 14px 12px; border-radius: 4px; border: 1px solid var(--clr-border); outline: 0; } .modal-body-b2b .modal-item-b2b input:focus { border-color: var(--clr-blue-movistar); } .modal-body-b2b .modal-item-b2b input::placeholder { color: #C9C9C9; font-weight: 400; } .modal-footer-b2b { display: flex; justify-content: center; align-items: center; gap: var(--size-md); padding: 16px 0; background: #fff; border-radius: 0 0 10px 10px; } /*Dropdowm input modal*/ .modal-dropdown i { position: absolute; right: var(--size-md); top: 52px; color: var(--clr-blue-movistar); transition: 0.5s; } .modal-dropdown i.fa-chevron-down { cursor: pointer; } .modal-dropdown i.clear-input { top: 54px; right: 58px; color: var(--clr-text); font-size: var(--size-sm); cursor: pointer; } .modal-dropdown.show i.fa-chevron-down { transform: rotate(180deg); } .cuentas-list { position: absolute; top: 93px; left: 0; display: flex; flex-direction: column; justify-content: flex-start; align-items: center; width: 100%; border: 0; max-height: 0; background: #fff; border-radius: 4px; padding: 0 16px; transition: 0.4s; overflow: hidden; z-index: 99; } .cuentas-list.list-all { position: relative; top: 0; max-height: 0; padding: 0; margin-top: var(--size-md); } .cuentas-list.list-all.show { max-height: 181px; } .modal-dropdown.show .cuentas-list { max-height: 300px; padding: 16px 18px; border: 1px solid var(--clr-border); box-shadow: 0 5px 20px rgb(0 0 0 / 15%); } .modal-dropdown.show .cuentas-list.no-result { max-height: 111px; } .cuentas-list .cuenta-search { position: relative; width: 100%; } .cuentas-list .cuenta-search input { position: relative; border-radius: 4px; border: 1px solid var(--clr-border); padding: 6px 8px 8px; margin-bottom: var(--size-md); } .cuentas-list .cuenta-search i { position: absolute; right: 10px; top: 11px; color: var(--clr-blue-movistar); } .cuentas-list .cuenta-search i.clear-input { top: 14px; right: 48px; color: var(--clr-text); font-size: var(--size-sm); cursor: pointer; } .cuentas-list .cuenta-search input:focus { border-color: var(--clr-blue-movistar); } .cuentas-list ul { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; list-style: none; width: 100%; color: var(--clr-text); max-height: 202px; overflow-y: auto; margin: 0; padding: 0; } .cuentas-list ul li { position: relative; display: flex; flex-direction: column; padding: 8px 0; cursor: pointer; width: 100%; border-radius: 4px; } .cuentas-list ul li span { padding: 0 8px; } .cuentas-list ul li span:nth-child(even) { font-size: var(--size-sm); } .cuentas-list ul li:hover, .cuentas-list ul li.active { background: var(--clr-secondary); font-weight: var(--font-bold); } .listado li.active::after { content: '✓'; position: absolute; top: 8px; right: var(--size-md); color: var(--clr-text); } .field-error-b2b, .field-error-b2b:focus { border-color: var(--clr-saldo-a-pagar) !important; } /* TOOLTIP */ .white-tooltip-b2b { position: relative; } .tooltip-b2b .dash-tooltip { position: absolute; top: 0px; left: 32px; background: var(--clr-text); color: var(--clr-white); font-family: "SF Pro Text", 'TelefonicaLight'; font-size: 12px; line-height: 20px; padding: 8px 8px 9px; border-radius: 8px; box-shadow: 0px 0px 7px rgba(42, 42, 60, 0.2); opacity: 0; pointer-events: none; transition: all var(--vel-trans) cubic-bezier(0.68, -0.55, 0.265, 1.55); z-index: 10; } .tooltip-b2b:hover .dash-tooltip.tooltip-active { top: -48px; opacity: 1; pointer-events: auto; } .tooltip-b2b.submenu-item:hover .dash-tooltip.tooltip-active { top: -38px; } .tooltip-b2b.tooltip-down:hover .dash-tooltip.tooltip-active { top: 48px; } .tooltip-b2b.tooltip-right:hover .dash-tooltip.tooltip-active { top: 60%; left: 11%; } .tooltip-b2b .dash-tooltip::before { content: ''; position: absolute; height: 10px; width: 10px; background: var(--clr-text); bottom: -5px; left: 50%; transform: translateX(-50%) rotate(45deg); transition: all var(--vel-trans) cubic-bezier(0.68, -0.55, 0.265, 1.55); } .tooltip-b2b.tooltip-down .dash-tooltip::before { bottom: 32px; } .tooltip-b2b.tooltip-right .dash-tooltip::before { left: 0; top: 36%; } .tooltip-b2b:hover .dash-tooltip { text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.4); } /*TOOLTIP NCND */ .tooltip-b2b.ncnd .dash-tooltip { width: 310px; left: -99px; padding: 8px 8px 9px; border-radius: 8px; z-index: 10; } .tooltip-b2b.ncnd:hover .dash-tooltip { top: -38px; } .tooltip-b2b.ncnd .dash-tooltip::before { bottom: 0; top: 31px; } /* FIN TOOLTIP */ /************************* CSS LUPA SHADOW **********************/ .lupa-tooltip { display: flex; align-items: center; width: fit-content; top: var(--lupaTooltipTop); left: var(--lupaTooltipLeft); background-color: #fff; cursor: default; padding: 8px 15px 8px 24px; position: absolute; z-index: 2; font-size: var(--size-md); border-radius: 10px; } #lupa-tooltip button:focus { outline: none; } #lupa-tooltip-msg { margin-bottom: 5px; margin-right: 20px; } .item-lupa-active { z-index: 9999; } #lupa-shadow { display: none; width: 100%; height: 100%; position: absolute; z-index: 9999; background: radial-gradient(1px at var(--lupaLeft) var(--lupaTop), transparent 0px, transparent var(--lupaSize), rgb(0 0 0 / 60%) 0px); } .highlighted-element { box-shadow: 0px 0px 20px 16px var(--clr-blue-movistar); background-color: white; z-index: 9999; } .shortcut-step1 { padding: 10px 12px 0px 0px; height: 100px; } .shortcut-step2 { padding: 10px 12px 10px 10px; margin-left: 25px; scroll-behavior: smooth; } .suspender-linea-focus { background-color: unset; } .modalBack { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); /* Opacidad del fondo */ z-index: 9998; /* Debe estar por encima de otros elementos */ } .clickeable { z-index: 9999; } .focusLupa { position: relative; } /****************************************************************/ /* RESTRICCIONES */ .btn-off a { color: var(--clr-white) !important; } .btn-off svg path { fill: var(--clr-white) !important; } /* FIN RESTRICCIONES */ .input-buscador-ico { color: #50535a; border: none; background-color: #e9eae8; background-position: calc(100% - 15px) center; background-repeat: no-repeat; background-clip: padding-box; border: 1px solid transparent; font-family: "TelefonicaLight", sans-serif; font-size: 16px; padding: 0 40px 0 20px; border-radius: 5px; min-height: 48px; -webkit-transition: all 0.25s ease-in; transition: all 0.25s ease-in; } /* MODAL ALIAS */ #ModalGestionAlias { display: flex; justify-content: center; align-items: center; gap: 10px; } #ModalGestionAlias label { margin: 0; } /* FIN MODAL ALIAS */ /* NEW POPUPS */ #popup { display: none; align-items: center; justify-content: center; width: 680px; text-align: center; top: 0; left: 0; right: 0; margin: 0 auto; } .redactar-gestion-holder .redactar-box { box-shadow: 3px 3px 20px 3px #00000075; } .redactar-gestion-holder .redactar-box header { display: flex; justify-content: flex-start; align-items: center; position: relative; padding: 13px 0; } .redactar-gestion-holder .redactar-box header .close-min { position: absolute; top: 0; right: 0; padding: 12px 19px; } .redactar-gestion-holder .redactar-box header .close-min a { font-size: 17px; } .redactar-gestion-holder .redactar-box footer { display: flex; justify-content: center; align-items: center; padding: 23px 0; } #mainPopup { display: flex; flex-direction: column; justify-content: center; align-items: center; } #mainPopup svg { margin: 29px 0 22px; } .mensaje-fuerte { font-size: 20px; padding: 10px 0 15px; } .mensaje-debil { margin-bottom: 6px; } /*V2*/ .redactar-gestion-holder .redactar-box .popup-header { display: flex; justify-content: center; align-items: center; position: relative; padding: 13px 0; } .redactar-gestion-holder .redactar-box .popup-header .close-min { position: absolute; top: 0; right: 0; padding: 12px 19px; } .redactar-gestion-holder .redactar-box .popup-header .close-min a { color: var(--clr-blue-movistar); font-size: x-large; } .redactar-gestion-holder .redactar-box .popup-section .popup-icon { margin: 15px 0 0 !important; } .redactar-gestion-holder .redactar-box .popup-section .mensaje-fuerte { font-size: 20px; padding: 10px 0 15px; padding: 0 25px; } .redactar-gestion-holder .redactar-box .popup-section .mensaje-debil { color: #86888C; margin-bottom: 6px; padding: 0 25px; } .redactar-gestion-holder .redactar-box .popup-footer { display: flex; justify-content: center; align-items: center; padding: 30px 0; } .redactar-gestion-holder .redactar-box .popup-footer button { background-color: var(--clr-blue-movistar); border: 1px solid var(--clr-blue-movistar); min-width: 120px; } /*FIN V2*/ /*FIN POPUP FACTU*/ #popux-box-shadow, #popux-box-shadow-tkt, #popup-box-shadow { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1001; background: rgba(49, 50, 53, 0.6); } .popux { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10000; background: #fff; width: 610px; padding: 2.5rem; box-shadow: 0 1rem 1.875rem rgba(0, 0, 0, 0.08); border-radius: 1rem; transition: .4s; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 1.25rem; padding: 3.25rem 1.25rem 3rem; visibility: visible; } .popux #disposex { position: absolute; right: 0; top: 0; margin: 0.625rem; padding: 0.625rem; } .popux h3 { font-family: "Roboto", sans-serif !important; font-size: 1.5rem; font-weight: 400; line-height: 2rem; color: #313235; margin-top: 1.125rem } .popux p { font-family: "Roboto", sans-serif !important; font-size: 1.125rem; font-weight: 400; line-height: 1.5rem; color: #71768B; margin-bottom: 1.25rem; text-align: center; } .popux a { font-family: "Roboto", sans-serif !important; } /*FIN POPUP FACTU*/ /* FIN NEW POPUPS */ .px-36 { padding: 10px 36px; } .th-fit-icon { width: 4rem; padding: 0.75rem 0 !important; } /* BANNER ERROR NC */ .errorNc { display: none; padding: 35px 34px; } .errorNc div { display: flex; flex-direction: column; align-items: flex-start; padding: 48px 64px; gap: 24px; border: 1px solid #DDDDDD; border-radius: 16px; background: #FFFFFF; } .errorNc p { font-family: 'SF Pro Display'; font-size: 24px; line-height: 32px; margin: 0; } .errorNc span { font-family: 'Roboto'; font-size: 18px; line-height: 24px; color: #86888C; margin-bottom: 16px; } .errorNc button { background-color: var(--clr-blue-movistar); border-color: var(--clr-blue-movistar); font-family: 'Roboto'; font-size: 18px; line-height: 24px; } .errorNc button:hover { background-color: #0356C9; border-color: #0356C9; } /* FIN BANNER ERROR NC */ /* SKELETON LOADING */ .skeleton { opacity: .7; animation: skeleton-loading 1s infinite alternate; } .skeleton-accesos-directos { width: 285px; height: 87px; border-radius: 8px; margin-right: 10px; } .skeleton-card { position: relative; width: 498px; height: 362px; border-radius: 8px; } .skeleton-title { position: relative; width: 97px; height: 8px; left: -35px; border-radius: 8px; } .skeleton-text { width: 100%; height: 8px; border-radius: 8px; margin: 16px 0; } .skeleton-text.text-tkt { height: 11px; } .skeleton-text:last-child { width: 80%; margin-bottom: 0; } .skeleton-menu { height: 12px; } .skeleton-banner { width: 100%; border-radius: 8px; } .skeleton-calipso { width: 90px !important; } .skeleton-tickets { height: 119px; } .skeleton-chip { height: 36px; width: 70px; border-radius: 24px; } .skeleton-text.skeleton-chip-service { width: 9.875rem; margin: 1rem 1rem; flex-shrink: 0; } .skeleton-circle { height: 20px; width: 20px; border-radius: 50%; } .skeleton-circle-lg { height: 97px; width: 97px; border-radius: 50%; } .skeleton-tkt { height: 208px; width: 100%; border-radius: 4px; } .skeleton-filter { height: 40px; width: 100%; border-radius: 6px; } .skeleton-shortcut { height: 108px; border-radius: 8px; } .skeleton-form, .skeleton-form-sm, .skeleton-form-lg { height: 48px; width: 300px; border-radius: 8px; margin: 32px 0; } .skeleton-form-sm { width: 124px; } .skeleton-form-lg { height: 85px; width: 543px; margin: 32px 0 0; } @keyframes skeleton-loading { 0% { background-color: hsl(200, 20%, 70%); } 100% { background-color: hsl(200, 20%, 95%); } } /* FIN SKELETON LOADING */ /* CONFIG NOTIFICACIONES */ .row-config { display: flex; justify-content: space-between; align-items: center; margin: 16px 0; } .row-config label { margin: 0; cursor: pointer; } input[type="checkbox"].b2b-switch { position: relative; /*width: 34px; height: 14px; background: rgb(176, 182, 202);*/ outline: none; transition: all 0.2s ease-in 0s; appearance: none; -webkit-appearance: none; /*border-radius: 40px;*/ cursor: pointer; /* == estilos actuales == */ width: 60px; height: 34px; border-radius: 34px; background-color: #ccc; } input:checked[type="checkbox"].b2b-switch { background: rgb(209, 213, 228); /* == estilos actuales == */ background-color: #2196f3; } input[type="checkbox"].b2b-switch:before { content: ''; position: absolute; /*top: 1px;*/ bottom: 0px; /*right: 21px; width: 20px; height: 20px;*/ margin: -4px; border-radius: 50%; transition: all 0.2s ease-in 0s; box-shadow: rgb(0 0 0 / 30%) 1px 1px 2px; /*background-color: rgb(209, 213, 228);*/ /* == estilos actuales == */ height: 26px; width: 26px; right: 31px; top: 8px; background-color: #fff; } input:checked[type="checkbox"].b2b-switch:before { /*right: 1px; background-color: var(--clr-blue-movistar);*/ /* == estilos actuales == */ right: 10px; } /* FIN CONFIG NOTIFICACIONES */ /* RICHTEXT */ #popup-richtext { width: 1250px; padding: 30px 44px 20px; } #popup-richtext .title-richtext { font-family: 'Roboto'; font-weight: 700; font-size: 28px; line-height: 32px; margin: 0; } #popup-richtext .richText .richText-editor, #popup-richtext .richText .richText-editor p, #popup-richtext .richText .richText-editor h1, #popup-richtext .richText .richText-editor h2, #popup-richtext .richText .richText-editor h3, #popup-richtext .richText .richText-editor h4 { font-family: 'TelefonicaLight', sans-serif !important; font-weight: 400; color: #313235; margin: 0; text-align: left; } #popup-richtext .richText .richText-editor h1, #popup-richtext .richText .richText-editor h2, #popup-richtext .richText .richText-editor h3, #popup-richtext .richText .richText-editor h4 { color: var(--clr-title-richtext); } /* FIN RICHTEXT */ /* BUTTON */ .button { position: relative; display: flex; justify-content: center; align-items: center; gap: 0.625rem; border: 0; outline: 0; font-size: 1.125rem; line-height: 1.5rem; font-weight: 500; border-radius: 0.25rem; cursor: pointer; transition: 0.4s; overflow: hidden; background-color: transparent; min-width: 138px; user-select: none; } .button span { font-family: "Roboto", sans-serif !important; } .button:focus { outline: 0 !important; } .button-table { margin: 0 auto !important; } .button.button-sm span { font-size: 0.875rem; line-height: 1.25rem; } .button.button-md span { font-size: 1rem; line-height: 1.5rem; } /* BUTTON CIRCLE */ .button.button-circle { border-radius: 50%; padding: 8px; background-color: #fff; border: 1px solid #fff; outline: 0; min-width: 40px !important; } .button.button-circle:hover svg path, .button.button-circle:active svg path { fill: #007acd; } .button.button-circle:active { border-color: #007acd; } .button.button-circle.button-table:hover svg path, .button.button-circle.button-table:active svg path { fill: #005a99; } .button.button-circle.button-table:active { border-color: #005a99; } /* BUTTON PRIMARY */ .button.button-primary { background-color: #007acd; border: 1px solid #007acd; color: #fff; outline: 0; } .button.button-primary svg path { fill: #fff; } .button.button-primary .text-content span { color: #fff; } .button.button-primary:hover .text-content span, .button.button-primary:disabled .text-content span { color: #005a99; } .button.button-primary:hover, .button.button-primary:active, .button.button-primary:disabled, .button.button-circle:disabled { background-color: #e6f5fd; color: #005a99; } .button.button-primary:hover, .button.button-primary:disabled, .button.button-circle:disabled { border-color: #e6f5fd; } .button.button-primary:active, .button.button-primary:disabled { border-color: #005a99; } .button.button-primary:hover svg path, .button.button-primary:active svg path, .button-primary:disabled svg path, .button.button-circle:disabled svg path { fill: #005a99; } /* BUTTON SECONDARY */ .button.button-secondary { background-color: #fff; color: #007acd; border: 1.5px solid #007acd; outline: 0; } .button.button-secondary .text-content span { color: #005a99; } .button.button-secondary:hover .text-content span { color: #fff; } .button.button-secondary:hover { background-color: #005a99; color: #fff; } .button.button-secondary:active { border-color: #005a99; color: #005a99; background-color: #fff; } .button.button-secondary:hover svg:not(.not-hover) path { fill: #fff; } .button.button-secondary:active svg:not(.not-hover) path { fill: #005a99; } .button .text-content { display: flex; align-items: center; justify-content: center; gap: 8px; opacity: 1; padding: 0.75rem 1.75rem; transition: opacity 0.3s cubic-bezier(0.77, 0, 0.175, 1), transform 0.3s cubic-bezier(0.77, 0, 0.175, 1); } .button.button-secondary .text-content { padding: 0.75rem; } .button.button-sm .text-content { padding: 0.375rem 0 !important; } .button.button-md .text-content { padding: 0.5rem 1rem 0.5625rem !important; } .button .loading-content { display: inline-flex; gap: 8px; position: absolute; top: 0; bottom: 0; justify-content: center; align-items: center; opacity: 0; transform: translateY(2rem); transition: opacity 0.3s cubic-bezier(0.77, 0, 0.175, 1), transform 0.3s cubic-bezier(0.77, 0, 0.175, 1); background: #fff; width: 100%; } .button.button-sm .loading-content { padding: 0.375rem 0 !important; } .button.button-primary .loading-content { background: #007acd !important; } .button .loading-content svg { flex-shrink: 0; animation: mistica-rotator 1.4s linear infinite; } .button .loading-content svg circle { stroke-dasharray: 187; stroke-dashoffset: 0; transform-origin: center; animation: mistica-dash 1.4s ease-in-out infinite; } .button.button-loading { pointer-events: none !important; } .button.button-loading .loading-content { transform: translateY(0); opacity: 1; } .button.button-loading .text-content { transform: translateY(-2rem); opacity: 0; } /* BUTTON LINK */ .button.button-link { justify-content: flex-start; color: #007acd; } /* BUTTON CHIP */ .button.button-chip { background-color: #E6F5FD; border-radius: 999px; color: #005A99; padding: 4px 12px; min-width: 93px; border: 1px solid #005A99; } .button.button-chip span { font-size: 14px; font-weight: 500; line-height: 20px; } .button.button-chip:hover span { color: #FFF; } .button.button-chip:disabled { background-color: #F6F6F6; border-color: #F6F6F6; color: #86888C; opacity: 1 !important; } .button.button-chip:hover { background-color: #005A99; color: #FFF; } .button.button-chip:hover svg path { fill: #FFF; } .button:disabled { opacity: .5 !important; pointer-events: none !important; } .button.button-circle:disabled { background-color: transparent; border: 1px solid #005A99; } button.button-chip-kite { background-color: #E6F5FD; border-radius: 999px; color: #005A99; min-width: 93px; cursor: default; } .button-chip-kite span { font-size: 14px !important; font-weight: 500 !important; line-height: 20px; } .button-chip-kite:disabled { background-color: #F6F6F6; border-color: #F6F6F6; color: #86888C; opacity: 1 !important; } /*FIN BUTTON */ /* MODAL NUEVOS */ .link-modal { color: #007ACD; font-weight: 600; } /* NEW CALENDAR */ .calendar-container { margin-top: 25px; max-width: 494px; } .calendar-container .calendar-title { font-size: 14px; line-height: 20px; color: #757575; margin-left: 10px; } .calendar-container .months-container { display: grid; grid-template-columns: repeat(3, 1fr); place-items: center; padding: 32px 26px; gap: 27px; border: 1px solid #D1D5E4; border-radius: 4px; margin-top: 24px; } .calendar-container .months-container.months-container-dash { padding: 16px 13px; gap: 13px; } .calendar-container .backAnios { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; gap: 10px; width: 100%; padding: 0 10px; } .calendar-container .backAnios p { font-size: 22px; line-height: 24px; margin: 0; } .calendar-container .backAnios.backAniosDashboard p { font-size: 18px; } .calendar-container .backAnios .nav-year { display: flex; justify-content: space-between; align-items: center; width: 100%; } .calendar-container .backAnios button:last-child { justify-content: flex-end !important; } #btn-prev-year-calipso, #btn-next-year-calipso { font-size: 14px; } /* FIN NEW CALENDAR */ /* TOOLTIPS STYLES */ [tooltip] { position: relative; } [tooltip]::before, [tooltip]::after { text-transform: none; font-size: 12px; line-height: 20px; user-select: none; pointer-events: none; position: absolute; display: none; opacity: 0; } [tooltip]::before { content: ""; border: 5px solid transparent; z-index: 1001; } [tooltip]::after { content: attr(tooltip); font-family: "SF Pro Text", 'TelefonicaLight'; text-align: center; min-width: 3em; max-width: 23em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 8px 8px 9px; border-radius: 8px; box-shadow: 0px 0px 7px rgb(42 42 60 / 20%); text-shadow: 0px -1px 0px rgb(0 0 0 / 40%); background: #4C4D52; color: #fff; z-index: 1000; } .tooltip-father:hover [tooltip]::before, [tooltip]:hover::before, .tooltip-father:hover [tooltip]::after, [tooltip]:hover::after { display: block; } [tooltip=""]::before, [tooltip=""]::after { display: none !important; } /* FLOW: UP */ [tooltip]:not([flow])::before, [tooltip][flow^="up"]::before { bottom: 100%; border-bottom-width: 0; border-top-color: #4C4D52; } [tooltip]:not([flow])::after, [tooltip][flow^="up"]::after { bottom: calc(100% + 5px); } [tooltip]:not([flow])::before, [tooltip]:not([flow])::after, [tooltip][flow^="up"]::before, [tooltip][flow^="up"]::after { left: 50%; transform: translate(-50%, -0.5em); } /* FLOW: DOWN */ [tooltip][flow^="down"]::before { top: 100%; border-top-width: 0; border-bottom-color: #4C4D52; } [tooltip][flow^="down"]::after { top: calc(100% + 5px); } [tooltip][flow^="down"]::before, [tooltip][flow^="down"]::after { left: 50%; transform: translate(-50%, 0.5em); } /* FLOW: LEFT */ [tooltip][flow^="left"]::before { top: 50%; border-right-width: 0; border-left-color: #4C4D52; left: calc(0em - 5px); transform: translate(-0.5em, -50%); } [tooltip][flow^="left"]::after { top: 50%; right: calc(100% + 5px); transform: translate(-0.5em, -50%); } /* FLOW: RIGHT */ [tooltip][flow^="right"]::before { top: 50%; border-left-width: 0; border-right-color: #4C4D52; right: calc(0em - 5px); transform: translate(0.5em, -50%); } [tooltip][flow^="right"]::after { top: 50%; left: calc(100% + 5px); transform: translate(0.5em, -50%); } /* KEYFRAMES */ @keyframes tooltips-vert { to { opacity: 0.9; transform: translate(-50%, 0); } } @keyframes tooltips-horz { to { opacity: 0.9; transform: translate(0, -50%); } } /* FX All The Things */ .tooltip-father:hover [tooltip]:not([flow])::before, [tooltip]:not([flow]):hover::before, .tooltip-father:hover [tooltip]:not([flow])::after, [tooltip]:not([flow]):hover::after, .tooltip-father:hover [tooltip][flow^="up"]::before, [tooltip][flow^="up"]:hover::before, .tooltip-father:hover [tooltip][flow^="up"]::after, [tooltip][flow^="up"]:hover::after, .tooltip-father:hover [tooltip][flow^="down"]::before, [tooltip][flow^="down"]:hover::before, .tooltip-father:hover [tooltip][flow^="down"]::after, [tooltip][flow^="down"]:hover::after { animation: tooltips-vert 300ms ease-out forwards; } .tooltip-father:hover [tooltip][flow^="left"]::before, [tooltip][flow^="left"]:hover::before, .tooltip-father:hover [tooltip][flow^="left"]::after, [tooltip][flow^="left"]:hover::after, .tooltip-father:hover [tooltip][flow^="right"]::before, [tooltip][flow^="right"]:hover::before, .tooltip-father:hover [tooltip][flow^="right"]::after, [tooltip][flow^="right"]:hover::after { animation: tooltips-horz 300ms ease-out forwards; } /* WHITE TOOLTIPS*/ .white-tooltip { position: absolute; top: 1rem; left: 0rem; width: 100%; padding: 0.5rem 1rem; z-index: 9; background: #FFFFFF; border: 1px solid #DDDDDD; box-shadow: 0px 0px 7px rgb(42 42 60 / 20%); border-radius: 8px; min-width: max-content; visibility: hidden; } .white-tooltip > p { font-family: 'Roboto'; color: var(--clr-text); margin: 0; font-weight: 400; font-size: 16px; } .white-tooltip.white-tooltip__whit-content > p span.info-tipo-tkt { font-weight: 600; } .white-tooltip.white-tooltip__whit-content > p span.example-tipo-tkt { font-weight: 400; } /* FIN TOOLTIP STYLES */ /* DETALLE DE LLAMADAS */ .detalle-consumos__heading { border: 1px solid #DDDDDD; border-radius: 6px; margin-top: 1rem; padding: 1rem 2rem .5rem 0.5rem; } .detalle-consumos__periodos-select { background-color: transparent; color: #007ACD; border: none; font-weight: 600; margin-left: 1rem; } button.detalle-consumos__periodos-select:focus { outline: none !important; border: none !important; } .detalle-consumos__periodos-select:hover { cursor: pointer; } .detalle-consumos__periodos-select > svg { transition: all 0.2s ease-in-out; transform: rotate(180deg); } .detalle-consumos__periodos-select > svg.active { transform: rotate(0deg); } .detalle-consumos__cambio-periodo-container { position: relative; margin-left: 2rem; } .detalle-consumos__periodos-list { position: absolute; will-change: transform; top: -1.5rem; right: -32px; transform: translate3d(-24px, 55px, 0px); display: none; z-index: 9; border: #dddddd solid 1px; border-radius: 4px; background-color: #fff; padding: 0.5rem 0; } .detalle-consumos__periodos-list > ul { list-style: none; } .detalle-consumos__periodos-list.show { display: block; } .period-item { padding: 0.25rem 1.5rem; clear: both; font-weight: 400; color: #000000; text-align: inherit; white-space: nowrap; background-color: transparent; border: 0; cursor: pointer; } .period-item:hover { background-color: #F2F4FF; font-weight: 600; } .period-item.active { background-color: #fff; color: #007ACD; } #comboUltimosCiclos { display: flex; margin-top: .8rem; } .detalle-consumos__chip { background: #E6F5FD; border-radius: 24px; padding: 0.3rem 1rem; font-weight: 600; color: #031A34; } .detalle-consumos__chip.empty-period { background: white; color: #D10000; padding: 0; width:260px; } .detalle-consumos__chip.hide { background: white; color: white; } /* SCROLL BAR */ ::-webkit-scrollbar { width: .5rem; height: .5rem; background: white; } ::-webkit-scrollbar-thumb { background: #B0B6CA; border-radius: 4px; } ::-webkit-scrollbar-track { background: white; box-shadow: none; } /* NEW TICKET */ .popup-tkt { position: fixed; top: -100%; left: 50%; transform: translate(-50%, -50%); z-index: 9999; background: #fff; padding: 30px 25px 27px; border: 1px solid #DDDDDD; border-radius: 6px; transition: 0.4s; visibility: hidden; width: 564px; } .popup-tkt * { font-family: 'Roboto', sans-serif !important; font-size: 16px; line-height: 20px; font-weight: 400; } .popup-tkt.active { top: 50%; visibility: visible; } .popup-tkt .popup-header, .popup-tkt .popup-footer { display: flex; justify-content: space-between; align-items: center; } .popup-tkt .popup-footer { position: relative; } .popup-tkt .popup-footer > div > .white-tooltip { top: -2.5rem; left: -5.5rem; } .popup-tkt .popup-footer > div > .svg-tooltip:hover ~ .white-tooltip { visibility: visible; } .popup-tkt .popup-content { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; gap: 4px; margin: 16px 0; overflow-y: auto; padding-right: 8px; height: unset; } .popup-tkt h2 { font-size: 24px; line-height: 20px; font-weight: 500; color: #757575; margin: 0; } .popup-tkt h3 { font-weight: 500; color: #031A34; margin: 0; } .popup-tkt h3 b { color: #757575; } .popup-tkt ul { display: flex; gap: 16px; margin: 22px 0 0; } .popup-tkt ul li { display: flex; align-items: center; gap: 6px; } .popup-tkt ul li input[type="radio"] { width: 20px; height: 20px; cursor: pointer; } .popup-tkt ul li label { font-size: 14px; font-weight: 500; color: #757575; margin: 0; cursor: pointer; } .popup-tkt .popup-content .popup-row { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; width: 100%; } .popup-tkt select { appearance: none; -webkit-appearance: none; -moz-appearance: none; } .popup-tkt select::-ms-expand { display: none; } .popup-tkt a { font-weight: 500; color: #007ACD; text-decoration: none; } .clasification-dropdown { width: 100%; position: relative; } .clasification-dropdown svg { position: absolute; top: 8px; right: 0; margin: 19px 19px 17px; z-index: -1; } .popup-item { width: 100%; border: 1px solid #dddddd; border-radius: 8px; padding: 14px 16px 13px; background-color: transparent; outline: 0; max-height: 47px; margin-top: 8px; } .error-tkt { border-color: #ec130e !important; } .popup-item.textarea-item { resize: none; height: 79px; max-height: 79px; } .row-attached { display: grid; grid-template-columns: repeat(3, 1fr); align-items: center; padding: 9px 16px; background: #F6F6F6; border: 1px dashed #C4C4C4; border-radius: 6px; width: 100%; } .row-attached span { font-size: 14px; font-weight: 500; color: #031A34; } .row-attached button { border: 1px solid #4E5259; } .helper-attached { font-size: 14px; color: #757575; margin: 0; } .error-helper-text { color: #ec130e; opacity: 0; height: 20px; } .error-helper-text.show-error { opacity: 1; margin: 4px 0; } input.error-helper-text { color: #031a34; border: 1px solid #ec130e; } .chip-adjunto { position: relative; font-size: 0.875rem; font-weight: 500; background: #FFFFFF; color: #313235; border: 1px solid #ddd; border-radius: 1.5rem; padding: 0.375rem 2.125rem 0.375rem 0.75rem; max-width: 165px; margin: .5rem 0 0; } .chip-adjunto p { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; margin: 0; } .chip-adjunto svg { position: absolute; top: 10px; right: 10px; cursor: pointer; } /* MENSAJE OK|ERROR DESDE EL POPUP NUEVO TICKET */ .popup-tkt.popup-tkt-aux { border-radius: 5px; width: 492px; height: auto; padding: 8px 10px; } .popup-tkt.popup-tkt-aux .popup-header .button-circle { padding: 10px; } .popup-tkt.popup-tkt-aux .popup-content { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; gap: 8px; height: auto !important; overflow: hidden; padding: 0 52px; } .popup-tkt.popup-tkt-aux .popup-content svg { align-self: center; } .popup-tkt.popup-tkt-aux .popup-content h2 { font-size: 24px; font-weight: 500; line-height: 20px; color: #031A34; margin: 0; white-space: nowrap; } .popup-tkt.popup-tkt-aux .popup-content h3 { font-family: "Roboto"; font-size: 18px; font-weight: 500; line-height: 20px; color: #757575; margin: 0; } .popup-tkt.popup-tkt-aux .popup-content p { font-size: 16px; line-height: 20px; color: #757575; margin: 12px 0; } .popup-tkt.popup-tkt-aux .popup-content p b { font-family: "Roboto"; font-weight: 500; } .popup-tkt.popup-tkt-aux .popup-content button { margin: 12px 0; } /* MEDIA QUERIES PARA POPUP TKT*/ @media screen and (max-width: 1600px) { .popup-tkt .popup-content { height: 578px; } } @media screen and (max-width: 1366px) { .popup-tkt .popup-content { height: 432px; } } /* ANIMATIONS */ @keyframes mistica-rotator { 0% { transform: rotate(0deg); } 100% { transform: rotate(270deg); } } @keyframes mistica-dash { 0% { stroke-dashoffset: 187; } 50% { stroke-dashoffset: 46.75; transform: rotate(135deg); } 100% { stroke-dashoffset: 187; transform: rotate(450deg); } } /* NOTIFICATION BOTTOM RIGHT */ .notif-b2b { position: absolute; right: 30px; bottom: 30px; background: #FFFFFF; border: 1px solid #DDDDDD; box-shadow: 0px 3px 4px rgba(0, 0, 0, 0.06); border-radius: 4px; /*z-index: 999;*/ } .notif-b2b .notif-b2b-x { position: absolute; right: 0; margin: 13px; cursor: pointer; } .notif-b2b .notif-b2b-content { display: flex; align-items: flex-start; gap: 12px; padding: 20px; } .notif-b2b .notif-b2b-content .notif-b2b-msj { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; } .notif-b2b .notif-b2b-content .notif-b2b-msj h4 { font-family: "Roboto"; font-weight: 500; font-size: 14px; line-height: 24px; color: #031A34; margin: 0; } .notif-b2b .notif-b2b-content .notif-b2b-msj p { font-family: "Roboto"; font-size: 12px; line-height: 18px; color: #757575; margin: 0; } .notif-b2b .notif-b2b-content .notif-b2b-msj p b { font-family: "Roboto"; font-weight: 500; } .notif-b2b .notif-b2b-content .notif-b2b-msj button { margin-top: 6px; } /* PANTALLA PARA RESOLUCION MOVIL */ #landing-mobile { margin: 1rem; padding-bottom: 76px; box-sizing: border-box; } /* Tengo que hacer esto porque sino toma la fuente del selector universal */ #landing-mobile * { font-family: 'Roboto'; font-style: normal; } #landing-mobile .lm-container { display: flex; flex-direction: column; height: 100%; padding-bottom: 76px; } #landing-mobile .lm-container .lm-top { display: flex; flex-direction: column; gap: 16px; margin-top: 66px; /* Asegura que lm-top no ocupe más espacio del necesario */ flex-shrink: 0; } #landing-mobile .lm-container .lm-top h2 { font-weight: 700; font-size: 24px; line-height: 32px; color: #313235; } #landing-mobile .lm-container .lm-top #primerLanding { font-weight: 300; font-size: 32px; line-height: 40px; color: #313235; } #landing-mobile .lm-container .lm-top p { font-weight: 400; font-size: 16px; line-height: 24px; color: #86888C; } #landing-mobile .lm-container .fixed-bottom button span { font-weight: 700; font-size: 16px; line-height: 24px; color: #FFF; } .btn-mobile-view { bottom: 1rem; left: 1rem; width: calc(100% - 2rem); box-sizing: border-box; } .a-all-width { display: block; background-color: #ffffff; text-align: center; padding: 0.35rem 1rem; cursor: pointer; text-decoration: none; } .a-all-width span { font-weight: 500; font-size: 14px; line-height: 20px; color: #007ACD; } /* ONBOARDING */ .popup-Onboarding { position: fixed; top: -100%; left: 50%; transform: translate(-50%, -50%); z-index: 9999; background: #fff; padding: 30px 40px 27px; border: 1px solid #DDDDDD; border-radius: 6px; transition: 0.4s; visibility: hidden; width: 583px; height: 473px; } .popup-Onboarding * { font-family: 'Roboto', sans-serif !important; font-size: 16px; line-height: 10px; font-weight: 400; } .popup-Onboarding.active { top: 50%; visibility: visible; } .popup-Onboarding .popup-header { display: flex; justify-content: right; align-items: center; } .popup-Onboarding .popup-footer { display: flex; justify-content: center; align-items: center; } .popup-Onboarding .popup-footer { position: relative; } .popup-Onboarding .popup-footer > div > .white-tooltip { top: -2.5rem; left: -5.5rem; } .popup-Onboarding .popup-footer > div > .svg-tooltip:hover ~ .white-tooltip { visibility: visible; } .popup-Onboarding .popup-content { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; gap: 4px; margin: 16px 0; overflow-y: auto; padding-right: 8px; height: unset; } .popup-Onboarding span { font-weight: 400; font-size: 16px; line-height: 24px; color: #86888C; } .popup-Onboarding h3 { font-weight: 300; font-size: 32px; line-height: 40px; color: #504F4F; } .popup-Onboarding .popup-content .popup-row { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; width: 100%; } /************************* CSS LUPA ONBOARDING **********************/ .lupa-onboarding-tooltip { display: flex; align-items: center; width: fit-content; top: var(--lupaOnboardingTooltipTop); left: var(--lupaOnboardingTooltipLeft); background-color: #fff; cursor: default; padding: 8px 15px 8px 24px; position: absolute; z-index: 99; font-size: var(--size-md); border-radius: 10px; font-family: 'Roboto', sans-serif !important; font-size: 16px; line-height: 15px; font-weight: 400; width: 350px; } #lupa-onboarding-tooltip button:focus { outline: none; } #lupa-onboarding-tooltip-msg { margin-bottom: 5px; margin-right: 20px; } .lupa-onboarding-tooltip-msg span { font-weight: 400; font-size: 16px; line-height: 24px; color: #86888C; font-family: 'Roboto', sans-serif !important; } .item-onboarding-lupa-active { box-shadow: 0px 0px 1px; background-color: white; z-index: 9999; height: 40px; } #lupa-onboarding-shadow { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9997; background: rgba(49, 50, 53, 0.6); } .focusLupa-onboarding { position: relative; } .icono-excel { background-image: url(/assets/img/excel_detalle_solid.svg); height: 18px; width: 18px; margin-top: 8px; display: inline-block; } #descargaXlsx:hover .icono-excel { background-image: url(/assets/img/excel_detalle_regular.svg); } .icono-excel-reg { background-image: url(/assets/img/excel_detalle_regular.svg); height: 18px; width: 18px; margin-top: 8px; display: inline-block; } /****************************************************************/ .header-top { display: flex; justify-content: space-between; align-items: center; background: var(--clr-white); padding: 16px 40px; } .header-icon h1 { margin: 0; } .header-icon h1 a { display: flex; justify-content: center; align-items: center; gap: 10px; } .header-icon h1 svg path { fill: #019DF4; } .header-info { display: flex; justify-content: flex-end; align-items: center; } .header-info .header-noti { position: relative; display: flex; justify-content: center; align-items: center; padding: 0 24px; cursor: pointer; } .header-info .header-noti .noti-badge { position: absolute; top: -6px; right: 14px; display: flex; justify-content: center; background: var(--bg-noti); font-size: 12px; width: 20px; height: 20px; border-radius: 50%; color: var(--clr-white); } .header-info .noti-dropdown { position: absolute; background-color: white; z-index: 999; height: fit-content; box-shadow: 0px 1px 17px 6px #000f0026; padding-bottom: 20px; width: 547px; top: 9%; right: 2%; opacity: 0; transition: all .4s ease; visibility: hidden; border-top: 2px solid transparent; } .header-info .noti-dropdown:before { content: ''; position: absolute; left: 0; right: 0; margin: -8px auto auto 54%; width: 0; height: 0; border-bottom: 9px solid white; border-left: 12px solid transparent; border-right: 12px solid transparent; } .header-info .noti-dropdown.dropdown-active { opacity: 1; visibility: visible; transform: translateY(20px); } .header-info .noti-config-dropdown { position: absolute; background-color: white; z-index: 1000; height: 20rem; box-shadow: 0px 1px 17px 6px #000f0026; top: 12%; right: 4%; opacity: 0; transition: all .4s ease; visibility: hidden; padding: 10px; border-top: 2px solid transparent; } .header-info .noti-config-dropdown:before { content: ''; position: absolute; left: 0; right: 0; margin: -18px auto auto 56%; width: 0; height: 0; border-bottom: 9px solid white; border-left: 12px solid transparent; border-right: 12px solid transparent; } .header-info .noti-config-dropdown div header { padding: 30px 20px 0px 25px; align-items: center; color: white; display: flex; justify-content: flex-start; } .header-info .noti-config-dropdown div header .close-min { position: absolute; right: 7%; } .header-info .noti-config-dropdown div header #notificacion-icon-popup { margin-right: 10px; } .header-info .noti-config-dropdown.dropdown-active { opacity: 1; height: fit-content; visibility: visible; } .header-info .header-user { display: flex; justify-content: center; align-items: center; height: 72px; padding: 0 16px; gap: var(--size-md); } .header-info .header-user i { font-size: 32px; color: #C5E1F5; } .header-info .header-user .header-user-info { display: flex; flex-direction: column; align-items: flex-end; margin-top: 20px; } .header-info .header-exit { padding-left: var(--size-md); } .header-info .header-exit a { display: flex; justify-content: center; align-items: center; gap: 8px; font-size: 20px; text-decoration: none; } .header-info .header-exit a span { padding: 0px 0px 5px; } .header-info .header-exit #gestionar-usuarios-logo.svg-disabled { opacity: 0.5; } .header-info .header-exit #gestionar-usuarios-tooltip.tooltip-disabled { display: none; } .header-logo a img { width: 90px; height: 90px; max-width: 165px; } .header-logo { margin-left: 30px; } .header-info .boton-nuevo-ticket { padding: 5px 16px 10px 16px; background-color: white; font-weight: 600; font-size: 18px; color: #007ACD; border: 1px #007ACD solid; border-radius: 4px; } .header-info .boton-nuevo-ticket:hover { background-color: #007ACD; font-weight: 700; color: white; } .header-bottom { display: flex; justify-content: space-between; align-items: center; background: white; padding: 16px 40px; height: 77px; border-bottom: 1px #DDDDDD solid; } .header-bottom .container { justify-content: space-between; display: flex; max-width: none; } /* Estilos POPOVER header */ .header-bottom .asesor-container { color: grey; display: flex; align-items: center; gap: 0.5rem; margin-top: -5px; position: relative; } .header-bottom .asesor-container p { margin-bottom: -5px; } .header-bottom .asesor-container .asesor-info { display: flex; align-items: center; gap: 0.5rem; } .header-bottom .asesor-container .asesor-info svg { cursor: pointer; outline: none; } .header-bottom .asesor-container .popover-b2b { display: flex; flex-direction: column; width: 488px; background: #ffffff; border: 1px solid; box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); border-radius: 8px; position: absolute; top: 130%; z-index: 100; } /*.header-bottom .asesor-container .popover-b2b.popover-topyempresas { width: 397px; }*/ .header-bottom .asesor-container .popover-b2b.popover-b2b-long { left: 33.5%; } .popover-b2b .caret { position: relative; width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; top: -10px; border-bottom: 10px solid #ffffff; } .popover-b2b .caret { display: block; } .popover-b2b .popover-b2b__content { display: grid; grid-template-columns: 50px 1fr 56px; margin-top: 1rem; padding-bottom: 2.5rem; } .popover-b2b .popover-b2b__content.popover-b2b__content__topyempresas { grid-template-columns: 1fr 50px; padding-bottom: 2.2rem; } .popover-b2b__fuera-horario-info { padding: 0 50px; } .popover-b2b__fuera-horario-info div.divider { margin: 1rem 0 0 -1rem; border-bottom: 1px solid #eeeeee; } .popover-b2b__fuera-horario-info p { color: black; font-weight: 400; font-size: 18px; } .popover-b2b__fuera-horario-info span { color: #86888c; } .popover-b2b__content p { color: black; font-weight: 400; font-size: 18px; } .popover-b2b__content div:first-child { justify-self: center; } .popover-b2b__info { display: flex; flex-direction: column; gap: 0.5rem; } .popover-b2b__info span { color: #86888c; } .popover-b2b__info div.divider { margin: 0.5rem 0; border-bottom: 1px solid #eeeeee; } .popover-b2b__info__footer { margin-top: 0.9rem; } .popover-b2b__info__footer__tye { display: flex; justify-self: left; flex-direction: column; margin-left: 20%; } .popover-b2b__info__footer__title p { font-size: 16px; color: #757575; } .x-popover { cursor: pointer; } /* Fin estilos POPOVER header*/ .header-dropdown { position: relative; display: flex; justify-content: center; align-items: flex-start; gap: var(--size-md); padding-right: 14px; width: inherit; color: var(--clr-text); transition: var(--vel-trans); } .header-dropdown .header-empresa { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding-right: 28px; cursor: pointer; overflow: hidden; max-width: 250px; } .header-dropdown .header-empresa i { position: absolute; right: 31px; top: 16px; transition: .4s; } .header-dropdown.show .header-empresa i { transform: rotate(180deg); } .header-dropdown .header-empresa .empresa-cuit { margin-bottom: 0.5rem; font-size: 14px; color: #313235; font-weight: 400; line-height: 20px; word-wrap: break-word; margin-left: 10px; max-width: 272px; border: none; } #empresa-cuit { margin-left: 0; cursor: pointer; } .header-dropdown .header-empresa.header-disabled { cursor: default; } .header-dropdown .header-empresa #empresa-nombre { color: black; font-size: 16px; font-weight: 600; line-height: 24px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; border: 1px #DDDDDD solid; border-radius: 6px; padding: 10px 15px; padding-top: 8px; padding-right: 40px; border-color: lightgrey; max-width: 250px; width: 250px; } .header-exit #exit-chevron { transition: 0.5s ease; cursor: pointer; } .header-exit .chevron-down { transform: rotate(180deg); } .header-exit .dropdown-menu-userinfo { visibility: hidden; position: absolute; right: 44px; opacity: 0; background-color: white; border-radius: 6px; transition: all 0.4s ease; } .header-exit .dropdown-menu-userinfo div { display: flex; padding: 22px; border-bottom: 1px #DDDDDD solid; } .header-exit .dropdown-menu-userinfo div a { color: grey; font-size: 15px; font-weight: 400; margin-left: 12px } .header-exit .dropdown-menu-userinfo div:hover a { color: darkslategrey; } .header-exit .dropdown-active { opacity: 1; transform: translateY(8px); visibility: visible; z-index: 10; } .header-buttons { position: relative; color: #007ACD; font-size: 16px; line-height: 24px; word-wrap: break-word; align-self: flex-end; margin-bottom: 0.5rem; } .header-buttons span { color: grey; font-weight: 100; } .header-buttons .btn-wpp-contactar-asesor span { color: white; } .header-buttons a { border: 0px; background-color: white; color: #007ACD; font-size: 16px; font-weight: 600; line-height: 24px; word-wrap: break-word; text-decoration: underline; align-items: flex-end; align-self: flex-end; } /*HEADER CHIPS*/ .header-chip { padding: 0; display: flex; } .header-chip li { margin-right: 20px; } .header-chip label { width: 158px; text-align: center; } /**Contactar asesor*/ .header-buttons .desplegable-contactar-asesor { position: absolute; border-radius: 7px; visibility: hidden; background-color: white; border: 1px solid #DDDDDD; top: 31px; right: 10px; padding: 14px; padding-bottom: 25px; width: 310px; display: flex; z-index: 9999; } .header-buttons .desplegable-contactar-asesor p { color: grey; font-weight: 600; padding-bottom: 0px; margin-bottom: 0rem; } .header-buttons .desplegable-contactar-asesor h3 { color: darkslategrey; font-weight: 500; } .header-buttons .desplegable-contactar-asesor #btn-contactar-asesor { color: white; padding: 3px 15px 8px 15px; border-radius: 4px; text-decoration: none; background-color: #007ACD; margin-top: 18px; } #boton-desplegable-contactar-asesor { cursor: pointer; } .header-buttons .desplegable-contactar-asesor #boton-desplegable-contactar-asesor.button-off { opacity: 0.6; } .header-buttons .desplegable-contactar-asesor.active { visibility: visible; } .header-subtitle { font-size: var(--size-lg); color: var(--clr-white); font-weight: 400; margin: 0; } .header-subtitle svg { width: 30px; margin-right: 8px; padding: 0px 0px 5px; } .header-subtitle svg path { fill: var(--clr-white); } .header-menu .header-menu-sidebar { position: absolute; left: 0; top: 60px; max-height: 0; background: var(--clr-white); border-radius: var(--border-radius); border: 0; box-shadow: 0 5px 20px rgb(0 0 0 / 15%); transition: var(--vel-trans); overflow: hidden; z-index: 999; } .header-menu.open .header-menu-sidebar { max-height: calc(100vh - var(--height-header)); border: 1px solid var(--clr-border); overflow-y: auto; } .header-menu-sidebar ul { display: flex; flex-direction: column; padding: 16px 0; margin: 0; } .header-menu-sidebar ul li { position: relative; display: flex; justify-content: flex-start; align-items: center; width: 260px; cursor: pointer; } .header-menu-sidebar ul li.active, .header-menu-sidebar ul li:hover { background-color: var(--clr-blue-movistar); } .header-menu-sidebar ul li a { display: flex; justify-content: flex-start; align-items: center; width: 100%; color: var(--clr-blue-movistar); text-decoration: none; padding: 8px 16px; } .header-menu-sidebar ul li.active a, .header-menu-sidebar ul li:hover a { color: var(--clr-white); } .header-menu-sidebar ul li a svg { width: var(--size-lg); opacity: .8; } .header-menu-sidebar ul li.active a svg, .header-menu-sidebar ul li:hover a svg { width: var(--size-lg); opacity: 1; } .header-menu-sidebar ul li a svg path { fill: var(--clr-blue-movistar); } .header-menu-sidebar ul li.active a svg path, .header-menu-sidebar ul li:hover a svg path { fill: var(--clr-white); } .header-menu-sidebar ul li a i { font-size: 20px; } .header-menu-sidebar ul li a span { position: relative; top: -2px; padding-left: var(--size-md); font-weight: var(--font-bold); } .nav-icon { display: flex; flex-direction: column; justify-content: center; align-items: center; height: 40px; } .header-empresa-list { position: absolute; top: 44px; left: 0; display: flex; flex-direction: column; justify-content: flex-start; align-items: center; border: 0; height: 0; background: var(--clr-white); border-radius: var(--border-radius); transition: var(--vel-trans); overflow: hidden; z-index: 999; } .header-dropdown.show .header-empresa-list { height: 300px; max-width: 336px; box-shadow: 0 5px 20px rgb(0 0 0 / 15%); } .header-dropdown.show .header-empresa-list.no-result { height: 111px; } .header-empresa-list .header-empresa-search { padding: 16px 18px 0px 18px; position: relative; } .header-empresa-list .header-empresa-search input { position: relative; width: 300px; padding: 6px 8px 8px; padding-left: 35px; border-radius: var(--border-radius); border: 1px solid lightgrey; margin-bottom: var(--size-md); } .header-empresa-list .header-empresa-search .lupa { position: absolute; top: 50%; /* Centrado vertical */ left: 30px; /* Espacio desde la izquierda del input */ transform: translateY(-50%); /* Desplazamiento vertical para centrar exactamente */ color: black; pointer-events: none; /* Asegura que el ícono no interfiera con el input */ } .header-empresa-list .header-empresa-search .clear-input { position: absolute; top: 50%; /* Centrado vertical */ right: 30px; /* Espacio desde la derecha del input */ transform: translateY(-50%); /* Desplazamiento vertical para centrar exactamente */ color: var(--clr-text); font-size: var(--size-sm); cursor: pointer; } .header-empresa-list .header-empresa-search input:focus { border-color: var(--clr-blue-movistar); } .header-empresa-list ul { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; list-style: none; width: 100%; color: var(--clr-text); max-height: 280px; overflow-y: auto; margin: 0; padding: 0; } .header-empresa-list ul li { padding: 8px 18px; cursor: pointer; width: 100%; box-shadow: 1px 6px 14px -2px rgba(0,0,0,0.04); -webkit-box-shadow: 1px 6px 14px -2px rgba(0,0,0,0.04); -moz-box-shadow: 1px 6px 14px -2px rgba(0,0,0,0.04); border-bottom: 1px solid #F5F5F5; } .header-empresa-list ul li span { display: block; padding: 0 8px; } .header-empresa-list ul li:hover, .header-empresa-list ul li.active { background: #F5F5F5; font-weight: 500; } .close-popover { position: absolute; top: 3px; right: 14px; cursor: pointer; } /* NOTIFICACIONES */ #notificacion-bubble, #notificacion-bubble-popup { position: absolute; top: -2px; left: 15px; display: flex; align-items: center; justify-content: center; width: 18px; height: 18px; background-color: #EC130E; color: white; border-radius: 50%; font-size: 12px; padding-bottom: 4px; } #notificacion-bubble { display: none; } #notificacion-bubble-popup { top: 0.9rem; left: 47rem; width: 15px; height: 15px; } #notificacion-icon { position: relative; cursor: pointer; } #notificacion-icon svg { width: var(--size-lg); } #notificacion-icon-popup i { color: black; } #box-notificaciones, #box-notificaciones-config { zoom: 85%; } .header-menu-sidebar::-webkit-scrollbar { width: 10px; } .row-config { display: flex; } /* Boton Contacta tu Asesor */ /* Agrego underline en hover al boton */ #boton-desplegable-contactar-asesor:hover .text-content span { text-decoration: underline; text-decoration-color: #007ACD; } /* Quitar el subrayado cuando el botón tiene las clases btn-off y btn-disabled */ #boton-desplegable-contactar-asesor.btn-off.btn-disabled .text-content span { text-decoration: none; } /* Quitar el subrayado cuando se hace hover sobre el botón con las clases btn-off y btn-disabled */ #boton-desplegable-contactar-asesor.btn-off.btn-disabled:hover .text-content span { text-decoration: none; } .grid-container { display: grid; grid-template-columns: 5.8rem auto; transition: all 0.6s ease; } .grid-container.sidebar-expanded { grid-template-columns: 16rem auto; } .grid-container.sidebar-expanded .sidebar-chevron { left: 243px; transition: all 0.6s ease; } #spinner-menu-fijo { position: absolute; width: 100%; text-align: center; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; height: calc(100vh - 189px); background: #fff; z-index: 10; padding: 16px 32px; } #spinner-menu-tickets { position: absolute; right: -2px; background-color: var(--clr-white); } .sidebar-chevron { position: absolute; left: 80px; top: 70px; cursor: pointer; transition: all 0.6s ease; z-index: 9998; } .sidebar-chevron.flip { transform: scaleX(-1); transition: all 0.6s ease; } .content-fixed { margin: auto; } .sidebar { height: 100vh; width: 5.8rem; background: white; border: 0.5px solid #B6B7B7; position: relative; transition: all 0.6s ease; z-index: 1001; } .sidebar.expanded { width: 16rem; } .sidebar.expanded .logo-details { opacity: 1; } .sidebar:hover .logo-details { opacity: 1; } .sidebar .logo-details { display: flex; justify-content: center; align-items: center; padding: 11px 0; margin: 0px 16px; border-bottom: 1px solid #D3D4D3; opacity: 0; transition: opacity 0.4s ease; } .sidebar .logo-details h1 { margin: 0; } .sidebar .logo-details img { width: 165px; height: 165px; max-width: 165px; } #spinner-menu-fijo .skeleton-container { display: inline-flex; } #spinner-menu-fijo .skeleton-container .skeleton-circle { padding: 20px; margin: 10px 5px 10px -4px; } #spinner-menu-fijo .skeleton-container .skeleton-text { width: 0rem; height: .6rem; opacity: 0; margin: 25px 0px 0px 10px; transition: all .6s ease; } .sidebar.expanded #spinner-menu-fijo .skeleton-container .skeleton-text { width: 9rem; opacity: 1; } .sidebar:hover #spinner-menu-fijo .skeleton-container .skeleton-text { width: 9rem; opacity: 1; } #spinner-logo-menu-fijo { padding: 58px; margin: 25px; transition: opacity .4s linear; } .sidebar.expanded #spinner-logo-menu-fijo { opacity: 1; } .sidebar:hover #spinner-logo-menu-fijo { opacity: 1; } .sidebar .nav-links { padding: 0 0px; max-height: calc(100vh - 189px); /* <- 188px (altura container logo) + 1px */ overflow: hidden; margin: 0; user-select: none; } .sidebar.expanded .nav-links { overflow-y: auto; } .sidebar:hover .nav-links { overflow-y: auto; } .sidebar .nav-links li.menu-item { position: relative; list-style: none; border-radius: 4px; margin: 12px 0; overflow: inherit; } .sidebar .nav-links li.menu-item:hover a .link_name, .sidebar .nav-links li.menu-item:hover .li-link { color: var(--clr-blue-movistar); } .sidebar .nav-links li .li-link { display: flex; justify-content: space-between; align-items: center; cursor: pointer; padding: 12px 25px; border-radius: 6px; overflow: hidden; } .sidebar .nav-links li .link_name { margin-left: 12px; display: none; text-overflow: ellipsis; white-space: nowrap; min-width: 1px; width: 100%; transition: all 1s ease; } .sidebar.expanded .nav-links li { display: block; } .sidebar:hover .nav-links li { display: block; } .sidebar.expanded .nav-links li .link_name { display: block; } .sidebar:hover .nav-links li .link_name { display: block; } /* fondo azulado al pasar sobre el menu de la opcion .sidebar .nav-links li:hover .li-link { background-color: #E6F5FD; } */ .sidebar .nav-links li .li-link .link_name { font-family: 'TelefonicaRegular', 'TelefonicaLight', sans-serif; width: 100%; } .sidebar .nav-links li a { display: flex; align-items: center; text-decoration: none; width: 100%; } .sidebar .nav-links li .li-link svg { min-width: 1.5rem; min-height: 1.5rem; width: 1.5rem; height: 1.5rem; } .sidebar .nav-links li a .link_name { font-family: 'TelefonicaRegular', 'TelefonicaLight', sans-serif; font-size: 16px; font-weight: 400; line-height: 24px; color: #50535A; } .sidebar .nav-links li:hover a .link_name, .sidebar .nav-links li.active a .link_name { color: var(--clr-blue-movistar); } .sidebar .nav-links li.btn-off a .link_name { color: white; } .sidebar .nav-links li i { font-size: 12px; cursor: pointer; display: none; transition: all 0.5s ease; } .sidebar.expanded .nav-links li i { display: inline-block; } .sidebar:hover .nav-links li i { display: inline-block; } .sidebar .nav-links li.showMenu i { transform: rotate(180deg); } .sidebar .nav-links li.showMenu .submenu { display: block; } .sidebar .nav-links li .submenu { display: none; } .sidebar .nav-links li .submenu li.submenu-item { position: relative; text-overflow: ellipsis; white-space: nowrap; list-style: none; border-radius: 4px; padding: 0 32px; display: none; } .sidebar.expanded .nav-links li .submenu li.submenu-item { display: flex; } .sidebar:hover .nav-links li .submenu li.submenu-item { display: flex; } .sidebar .nav-links li .submenu a { font-family: 'TelefonicaRegular', 'TelefonicaLight', sans-serif; color: #50535A; padding: 10px 0px 10px 16px; } .sidebar .nav-links li .submenu li:hover a, .sidebar .nav-links li .submenu-item.active a { color: var(--clr-blue-movistar); } .menu-item.active div.li-link { color: #007ACD !important; background-color: #E6F5FD; } .menu-disabled, .menu-disabled a, .menu-disabled a span { color: #86888C !important; cursor: default !important; } /**menu item diferente: PASATE A MOVISTAR */ .menu-item-destacado { margin-top: -7px !important; margin-bottom: -7px !important; } .menu-item-destacado div { visibility: hidden; margin-left: -15px; background: #E6F5FD; border-radius: 20px; padding: 7px 17px; opacity: 0; width: fit-content; border: 1px solid #E6F5FD; transition: all .4s ease; } .menu-item-destacado div a span { color: #005A99 !important; } .menu-item-destacado div:hover { border-color: #005A99; } .sidebar.expanded .menu-item-destacado div { padding-top: 10px; padding-bottom: 10px; border-bottom-left-radius: 20px; border-top-left-radius: 20px; visibility: visible; opacity: 1; } .sidebar:hover .menu-item-destacado div { padding-top: 10px; padding-bottom: 10px; border-bottom-left-radius: 20px; border-top-left-radius: 20px; visibility: visible; opacity: 1; } /* TAG NUEVO MENU FIJO */ .tag-new-menu { position: absolute; right: -22px; top: 2px; font-family: "Roboto", sans-serif; font-weight: 400; font-size: 14px; line-height: 24px; color: #fff; background-color: #A40F4D; border-radius: 9999px; padding: 0 6px 0 7px; margin: 10px 0; pointer-events: none; user-select: none; } :root { --fontBase: 'Roboto', 'TelefonicaLight', sans-serif; --fontWeightBolder: 600; --textPrimary: #031A34; --textSecondary: #707785; --textLink: #007ACD; --textError: #EC130E; --borderColorB2B: #DDD; --borderColorB2B_2: #D1D5E4; --borderBottomColorB2B: #EEE; --highlightsB2B: #0B2739; --whiteB2B: #FFF; --skyBlueB2B: #E6F5FD; --blueB2B: #005A99; --grayB2B: #86888C; --velTransition: 0.4s; } /* =========== */ /* BREADCRUMBS */ /* =========== */ .breadcrumbs { display: flex; justify-content: flex-start; align-items: center; gap: 0.25rem; font-size: 0.875rem; line-height: 1.25rem; list-style: "/"; margin: 0; } .breadcrumbs li { padding: 0 0.5rem; } .breadcrumbs li:first-child { list-style: none; } .breadcrumbs li::marker { color: var(--textPrimary); } .breadcrumbs li span { font-family: var(--fontBase); font-size: 0.875rem; line-height: 1.25rem; color: var(--textSecondary); } .breadcrumbs li:first-child span { color: var(--textPrimary); } /* =========== */ /* CHIPS */ /* =========== */ .chip { display: flex; justify-content: center; align-items: center; } .chip input[type="radio"] { display: none; } .chip label { font-family: var(--fontBase); font-weight: 500; padding: 0.375rem 0.75rem; background-color: var(--whiteB2B); border: 1px solid var(--borderColorB2B); border-radius: 1.5rem; cursor: pointer; transition: var(--velTransition); user-select: none; margin: 0; } .chip input[type="radio"]:checked + label { background-color: var(--skyBlueB2B); border-color: var(--blueB2B); color: var(--blueB2B); } .chip:hover label { background-color: var(--skyBlueB2B); border-color: var(--skyBlueB2B); color: var(--blueB2B); } /* =========== */ /* BUTTONS */ /* =========== */ .button { position: relative; display: flex; justify-content: center; align-items: center; gap: 0.625rem; border: 0; outline: 0; border-radius: 0.25rem; cursor: pointer; transition: var(--velTransition); overflow: hidden; background-color: transparent; min-width: 138px; user-select: none; } .button span { font-family: var(--fontBase); font-size: 1.125rem; line-height: 1.5rem; font-weight: 500; } .button:focus { outline: 0 !important; } .button .text-content { display: flex; align-items: center; justify-content: center; gap: 0.5rem; opacity: 1; padding: 0.75rem 1.75rem; transition: opacity 0.3s cubic-bezier(0.77, 0, 0.175, 1), transform 0.3s cubic-bezier(0.77, 0, 0.175, 1); } .button .loading-content { display: inline-flex; gap: 0.5rem; position: absolute; top: 0; bottom: 0; justify-content: center; align-items: center; opacity: 0; transform: translateY(2rem); transition: opacity 0.3s cubic-bezier(0.77, 0, 0.175, 1), transform 0.3s cubic-bezier(0.77, 0, 0.175, 1); background: var(--whiteB2B); width: 100%; } .button .loading-content svg { flex-shrink: 0; animation: mistica-rotator 1.4s linear infinite; } .button .loading-content svg circle { stroke-dasharray: 187; stroke-dashoffset: 0; transform-origin: center; animation: mistica-dash 1.4s ease-in-out infinite; } .button:disabled { opacity: .5 !important; pointer-events: none !important; } /* SIZE SMALL */ .button.button-sm span { font-size: 0.875rem; line-height: 1.25rem; } .button.button-sm .text-content, .button.button-sm .loading-content { padding: 0.375rem 0 !important; } /* SIZE MEDIUM */ .button.button-md span { font-size: 1rem; line-height: 1.5rem; } .button.button-md .text-content { padding: 0.5rem 1rem 0.5625rem !important; } /* LOADING STATE */ .button.button-loading { pointer-events: none !important; } .button.button-loading .loading-content { transform: translateY(0); opacity: 1; } .button.button-loading .text-content { transform: translateY(-2rem); opacity: 0; } /* == TYPE PRIMARY == */ .button.button-primary { background-color: var(--textLink); border: 1px solid var(--textLink); color: var(--whiteB2B); outline: 0; } .button.button-primary svg path { fill: var(--whiteB2B); } .button.button-primary .text-content span { color: var(--whiteB2B); } .button.button-primary:active .text-content span { color: var(--blueB2B); } .button.button-primary:hover .text-content span, .button.button-primary:disabled .text-content span { color: var(--blueB2B); } .button.button-primary:hover, .button.button-primary:active, .button.button-primary:disabled { background-color: var(--skyBlueB2B); color: var(--blueB2B); } .button.button-primary:hover, .button.button-primary:disabled, .button.button-primary:active, .button.button-primary:disabled { border-color: var(--skyBlueB2B); } .button.button-primary:hover svg path, .button.button-primary:active svg path, .button-primary:disabled svg path { fill: var(--blueB2B); } .button.button-primary .loading-content { background: var(--textLink) !important; } /* == TYPE SECONDARY == */ .button.button-secondary { background-color: var(--whiteB2B); color: var(--textLink); border: 1.5px solid var(--textLink); outline: 0; } .button.button-secondary .text-content span { color: var(--blueB2B); } .button.button-secondary:hover:not(:active) .text-content span { color: var(--whiteB2B); } .button.button-secondary:hover { background-color: var(--blueB2B); color: var(--whiteB2B); } .button.button-secondary:active { border-color: var(--blueB2B); color: var(--blueB2B); background-color: var(--whiteB2B); } .button.button-secondary:hover svg path { fill: var(--whiteB2B); } .button.button-secondary:active svg path { fill: var(--blueB2B); } .button.button-secondary .text-content { padding: 0.75rem; } /* =========== */ /* SEARCH BOX */ /* =========== */ .search-box { position: relative; background-color: var(--whiteB2B); border: 1px solid var(--borderColorB2B); border-radius: 0.25rem; width: 100%; min-width: 29rem; } .search-box * { font-family: var(--fontBase); } .search-box.show { border-radius: 0.25rem 0.25rem 0 0; } .search-box input { font-size: 1.125rem; line-height: 1.5rem; color: var(--textPrimary); padding: 1.5rem 3rem 0.5rem 3.25rem; border: 0; outline: 0; background-color: transparent; width: 100%; } .search-box label { position: absolute; left: 3.25rem; top: 0; font-size: 1rem; line-height: 1.5rem; margin: 1rem 0; cursor: text; transition: var(--velTransition); pointer-events: none; user-select: none; } .search-box svg { position: absolute; left: 0; margin: 1rem 0.875rem; } .search-box svg.x { left: unset; right: 0; display: none; cursor: pointer; } .search-box input:valid ~ label, .search-box input:focus ~ label { font-size: 0.875rem; margin: 2px 0 0; color: var(--textSecondary); } .search-box input:valid ~ svg { display: initial; } /* SIZE SMALL */ .search-box.box-sm input { padding: 1rem 3rem 0.25rem 3.25rem; } .search-box.box-sm label { font-size: 1rem; margin: 0.625rem 0; } .search-box.box-sm svg { margin: 0.625rem 0.875rem; } .search-box.box-sm input:valid ~ label, .search-box.box-sm input:focus ~ label { font-size: 0.75rem; line-height: 1.25rem; margin: 0; } /* CONTENT RESULT */ .content-result { position: relative; width: 100%; } .content-result * { font-family: var(--fontBase); } .content-result .text-label { font-size: 0.875rem; line-height: 1.25rem; color: var(--textSecondary); padding: 0.25rem 0.75rem; } .content-result .text-label.text-error { color: var(--textError) !important; } .content-result .search-box-result { display: none; position: absolute; top: 1; z-index: 99; width: 100%; overflow-y: auto; background-color: var(--whiteB2B); border: 1px solid var(--borderColorB2B); border-radius: 0 0 0.25rem 0.25rem; } .content-result .search-box-result.show { display: block; } .content-result .search-box-result .header-result { margin: 1rem 3rem 0; } .content-result .search-box-result .header-result span { color: var(--grayB2B); } .content-result .search-box-result .list-result { max-height: calc(100vh - 577px); overflow-y: auto; background: var(--whiteB2B); list-style-type: none; margin: 0; } .content-result .search-box-result .list-result li > label { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 0; margin: 0 1.25rem; border-bottom: 1px solid var(--borderBottomColorB2B); cursor: pointer; } .content-result .search-box-result .list-result li > label div { display: flex; justify-content: flex-start; align-items: center; } .content-result .search-box-result .list-result li > label > div > svg { width: 0.875rem; height: 1.25rem; margin-top: 3px; } .content-result .search-box-result .list-result li > label > div > div { flex-direction: column; align-items: flex-start; gap: 3px; margin-left: 1.5rem; } .content-result .search-box-result .list-result li > label > div > div > span { font-size: 0.875rem; line-height: 1.25rem; color: var(--grayB2B); } .content-result .search-box-result .list-result li > label > div > div > span:first-child { font-size: 1rem; line-height: 1.5rem; color: var(--textSecondary); } .content-result .search-box-result .list-result li > label > div > div > span > b { font-weight: var(--fontWeightBolder); color: var(--highlightsB2B); } .content-result .search-box-result .footer-result { text-align: center; margin: 0.75rem 0; } .content-result .search-box-result .footer-result > a { font-weight: 500; color: var(--textLink); text-decoration: none; } /* =========== */ /* DROPDOWN */ /* =========== */ .dropdown { position: relative; width: 100%; } .dropdown * { font-family: var(--fontBase); } .dropdown > label { display: flex; justify-content: space-between; align-items: center; padding: 1rem 0.875rem; color: var(--textPrimary); border: 1px solid var(--borderColorB2B_2); border-radius: 0.25rem; background: var(--whiteB2B); cursor: pointer; user-select: none; transition: var(--velTransition); margin: 0; } .dropdown.dropdown-sm > label { padding: 0.375rem 0.75rem; border-radius: 0.5rem; } .dropdown > label svg { transition: var(--velTransition); } .dropdown > span { font-size: 0.875rem; line-height: 1.25rem; color: var(--textSecondary); padding: 0.25rem 0.75rem; } .dropdown input[type="checkbox"], .dropdown ul { display: none; } .dropdown > ul { background: var(--whiteB2B); z-index: 99; list-style-type: none; margin: 0; position: absolute; width: 100%; top: 3.625rem; max-height: calc(100vh - 24rem); overflow-y: auto; border: 1px solid var(--borderColorB2B_2); border-radius: 0.25rem; } .dropdown.dropdown-sm > ul { top: 2.375rem; } .dropdown > ul > li.list-header { margin: 1.25rem 2.875rem 0 1.75rem; } .dropdown > ul > li.list-header > span { font-size: 1.125rem; line-height: 1.5rem; color: var(--textSecondary); } .dropdown > ul > li > label { display: flex; justify-content: space-between; align-items: center; padding: 1rem 0; margin: 0 2.875rem 0 1.75rem; border-bottom: 1px solid var(--borderBottomColorB2B); cursor: pointer; } .dropdown > ul > li > label div { display: flex; justify-content: flex-start; align-items: center; gap: 0.4rem; } .dropdown > ul > li > label div > svg { width: 1.875rem; height: 1.875rem; position: initial; } .dropdown > ul > li > ul > li { position: relative; display: flex; justify-content: flex-start; align-items: center; gap: 0.875rem; padding: 0.75rem 2.875rem 0.75rem 4.4rem; cursor: pointer; } .dropdown > ul > li > ul > li:hover { background: rgba(242, 244, 255, 0.5); } .dropdown > ul > li > ul > li::before, .dropdown > ul > li > ul > li::after { content: ""; width: 1.5rem; height: 50%; position: absolute; background: var(--whiteB2B); left: 2.625rem; top: 0; border-left: 2px solid var(--borderBottomColorB2B); border-bottom: 2px solid var(--borderBottomColorB2B); z-index: -1; } .dropdown > ul > li > ul > li::after { top: 50%; border-bottom: none; z-index: -2; } .dropdown > ul > li > ul > li:last-child::before { border-radius: 0 0 0 0.5rem; } .dropdown > ul > li > ul > li:last-child::after { content: none; } .dropdown > ul > li > ul > li > div { display: flex; flex-direction: column; } .dropdown > ul > li > ul > li > div > span { font-size: 0.875rem; line-height: 1.25rem; color: var(--textSecondary); } .dropdown > ul > li > ul > li > div > span:first-child { color: var(--textPrimary); } /* SHOW & HIDE LISTS */ .dropdown [id^="ddown"]:checked + label { border-radius: 0.25rem 0.25rem 0 0; } .dropdown [id^="ddown"]:checked + label + ul { display: block; border-top: none; border-radius: 0 0 0.25rem 0.25rem; } .dropdown.dropdown-sm [id^="ddown"]:checked + label { border-radius: 0.5rem 0.5rem 0 0; } .dropdown.dropdown-sm [id^="ddown"]:checked + label + ul { display: block; border-top: none; border-radius: 0 0 0.5rem 0.5rem; } /* =========== */ /* INPUTS FORM */ /* =========== */ .frm-row { display: flex; flex-direction: column; width: 100%; } .frm-row * { font-family: var(--fontBase); } .frm-row label { color: var(--textPrimary); margin: 0; } .frm-row label > s { color: var(--textError); text-decoration: none; } .frm-row .form-item { width: 100%; border: 1px solid var(--borderColorB2B); border-radius: 0.5rem; padding: 0.875rem 1rem 0.75rem; background-color: transparent; outline: 0; max-height: 2.75rem; margin: 0.25rem 0; } .frm-row .form-item.form-sm { padding: 0.75rem 0.75rem 0.5rem; } .frm-row p { font-size: 0.875rem; line-height: 1.25rem; color: var(--textSecondary); margin: 0; } /* =========== */ /* BOX CONTENT */ /* =========== */ .box-content { display: flex; flex-direction: column; border: 1px solid var(--borderColorB2B); border-radius: 0.5rem; padding: 1rem; width: 100%; } .box-content * { font-family: var(--fontBase); } .box-content.box-50 { width: 50%; } .box-content.box-60 { width: 60%; } .box-content.box-80 { width: 80%; } /* == MEDIAS QUERY == */ @media screen and (max-height: 900px) { .content-result .search-box-result .list-result { max-height: calc(100vh - 397px); } } @media screen and (max-height: 768px) { .content-result .search-box-result .list-result { max-height: calc(100vh - 263px); } } /*Spinner*/ @keyframes spinner-border { to { transform: rotate(360deg); } } .spinner-border { display: inline-block; width: 2rem; height: 2rem; vertical-align: text-bottom; border: .25em solid currentColor; border-right-color: transparent; border-radius: 50%; animation: spinner-border .75s linear infinite; } .spinner-border-sm { width: 1rem; height: 1rem; border-width: .2em; } /* Growing circle*/ @keyframes spinner-grow { 0% { transform: scale(0); } 50% { opacity: 1; } } .spinner-grow { display: inline-block; width: 1rem; height: 1rem; vertical-align: text-bottom; background-color: currentColor; // stylelint-disable-next-line property-blacklist border-radius: 50%; opacity: 0; animation: spinner-grow .75s linear infinite; } .spinner-grow-sm { width: 1rem; height: 1rem; } #backLys { margin-left: 25px; } #backLysRoaming { margin-left: 25px; } #backLysFwa { color: #019BEF; border-color: #019BEF; border: 1.5px solid #019BEF }